ここでは働くsurvey.jsの反応例があります:http://plnkr.co/edit/qXdeQa6x2FHRg0YrOlPL?p=previewsurvey.jsでReactコンポーネントをレンダリングする方法は?
私のHTMLも頭に<script src="https://unpkg.com/survey-react"></script>
が含まれています。
私のmain.jsxでは、jsonファイルと複数の反応コンポーネントに基づいて塗りつぶされるdivのレンダリングを呼び出しています。私のjson配列には、survey.jsのjsonオブジェクトもあります。私が達成したいのは、配列を解析する際に質問オブジェクトに到達したときにサーベイをレンダリングすることです。
私はそれのために、この呼び出しを持っている私のトップレベルのコンポーネントで:
if (section.hasOwnProperty('questions')){
return <Questions key={i+"questions"} id={i+"questions"} questions={section.questions} />;
Questions.jsx:
var React = require('react');
var ReactDOM = require('react-dom');
var Survey = require('survey-react');
var Questions = React.createClass({
render: function() {
Survey.Survey.cssType = "bootstrap";
Survey.defaultBootstrapCss.navigationButton = "btn btn-green";
window[this.props.id] = new Survey.Model(this.props.questions);
var questionid = this.props.id;
var idi = this.props.id.replace("questions","");
return (
<dt>
<div id={this.props.id}></div>
</div>
</dt>
);
}
});
module.exports = Questions;
ReactDOM.render(<Survey.Survey model={window[questionid]} />, document.getElementById({questionid}));
それはエラーなしでコンパイルんが、その後のブラウザで、私は、コンソールエラーが発生します:
TypeError: WEBPACK_IMPORTED_MODULE_1_react is undefined[Learn More] ReferenceError: questionid is not defined
私は間違ったやり方をしようとしているようですが、それを正しく行う方法はありますか?私は反応するのが新しく、コンポーネントの中でreactDOMを使い慣れていないし、survey.jsの私の最初のプロジェクトでもある。
ありがとうございます。
最後に、私は、この統合をやって停止しました。この例は大丈夫と思われますので、私はそれを受け入れますが、将来の訪問者にとってはあなたのコードをここに掲載する方が安全です。 – obeliksz