小编ger*_*m13的帖子

我正在尝试使用React渲染画布.画布内的图形也将由Reacts render方法处理.

当前代码确实使用我想要的图形渲染画布.但是我正在寻找一种方式来回报我的图形画布从内render方法.我想要这个的原因是因为我希望这个以"React Way"工作.

理想情况下,我希望我的代码是这样的:

return(
  <div>
    <canvas id='my_canvas_with_graphics_rendered_in_react'></canvas>
  </div>
);

首先,我想知道这是否可行.或者,如果我应该寻找替代方案.

也许我错过了React的观点,如果是这样的话请告诉我.我希望有一个解决方案,因为从我读过的内容看,React将自己称为Vin MVC.这就是为什么,如果可能的话,这将是我正在尝试做的完美解决方案.我不必担心画布内的渲染.我只是将数据提供给组件,React将重新呈现更改.

我在return声明中标明了我认为正确的代码应该去的地方.

该HTML代码:

<div id='wrapper'>
    <canvas id='canvas'></canvas>
</div>

该jsx代码:

var MyCanvas = React.createClass({
    render:function(){
        var line = this.props.lines;
        var ctx = this.props.canvas.getContext("2d");

        ctx.strokeStyle = 'rgba(0,0,0,0.5)';
        ctx.beginPath();
        ctx.moveTo(line[0].x0, line[0].y0);
        // .... more code .....
        ctx.stroke();

        return(
            <div>
                /* *********************************
                ??? RETURN MY RENDERED CANVAS
                    WITH GRAPHIC LINES. ????
             This is where I want to …