React: React échoue avec les balises de script.

Créé le 11 avr. 2015  ·  3Commentaires  ·  Source: facebook/react

React n'aime pas ça :

    render: function() {
        return (
            <div class="gl-map-container">

                <script id="shader-fs" type="x-shader/x-fragment">
                    precision mediump float;

                    void main(void) {
                        gl_FragColor = vec4(1.0, 1.0, 1.0, 1.0);
                    }
                </script>

                <script id="shader-vs" type="x-shader/x-vertex">
                    attribute vec3 aVertexPosition;

                    uniform mat4 uMVMatrix;
                    uniform mat4 uPMatrix;

                    void main(void) {
                        gl_Position = uPMatrix * uMVMatrix * vec4(aVertexPosition, 1.0);
                    }
                </script>

                <canvas width='500' height='500' className="gl-map-canvas">
                </canvas>
            </div>
        );
    }

Quelle est la solution ?

Commentaire le plus utile

Vous voulez probablement cela. Mais même ainsi, votre script ne s'exécutera probablement pas (la plupart des navigateurs n'exécuteront pas de scripts lorsqu'ils sont innerHTML.

<script dangerouslySetInnerHTML={{__html: `
  alert();
`}} />

Tous les 3 commentaires

Peux-tu être plus précis? À quoi vous attendiez-vous ? Que s'est-il passé à la place ?

Vous voulez probablement cela. Mais même ainsi, votre script ne s'exécutera probablement pas (la plupart des navigateurs n'exécuteront pas de scripts lorsqu'ils sont innerHTML.

<script dangerouslySetInnerHTML={{__html: `
  alert();
`}} />

Chérie, ça marcherait ! C'est type="x-shader/x-vertex" , etc., donc le navigateur n'est pas censé le lire de toute façon. Je peux le récupérer plus tard (componentDidMount) pour compiler les shaders. Ironiquement, j'ai fini par utiliser des chaînes de modèle en dehors de JSX, ce qui finit par avoir une coloration syntaxique dans Vim, donc encore mieux.

Cette page vous a été utile?
0 / 5 - 0 notes