0
Я изучаю реакцию, и я пытаюсь сделать холст обработанным и обновить его каждый раз, когда состояние изменилось.React render/update canvas
//set initial state
constructor(props) {
super(props);
this.state = {
imgFile: this.props.imgFile,
show: false
};
}
//The render canvas
render() {
return (
<div className="col-sm-4">
<canvas ref={(c) => { this.myCanvas = c; }} />
</div>
);
}
Мой вопрос: есть ли способ обновить холст у реквизита? до сих пор я получил это:
componentDidMount() {
const origin = this.state.imgFile;
// canvas area/img calculations
this.funcForDrawCanvas(origin.path, origin.presition, origin.height, origin.width);
}
но после того, как компонент был установлен, он не обновляет его уже никакой идеей? или есть способ удалить тег canvas и поместить его снова, когда состояние изменено?
Обязательно прочитайте, что делает каждая спецификация компонентов. Есть много способов сделать это, но как насчет инициализации холста на ['componentDidMount'] (https://facebook.github.io/react/docs/component-specs.html#mounting-componentdidmount), проверьте наличие изменений prop, используя ['shouldComponentUpdate'] (https://facebook.github.io/react/docs/component-specs.html#updating-shouldcomponentupdate) и сделать рендеринг холста на [' componentDidUpdate'] (https://facebook.github.io /react/docs/component-specs.html#updating-componentdidupdate). – Dom
@ Dom вы можете дать мне пример того, как can canvas можно перерисовать с помощью img? –