我是reactJS的新手,想知道我所做的是否有良好的风格和意义。
我们有一个很老的应用程序,它是用PHP编写的,使用了smarty模板/jquery的前端渲染。我们最近开始实现react.js,我正在开发一个功能,让用户可以查看不完整候选列表。此列表取决于站点和测试。
一个php脚本被调用请求站点和测试。在这个php脚本中,有一些函数返回smarty模板呈现的不完整候选数组。
现在我已经重构了,所以在smarty模板中有一个div,在那里我实现了一个jsx脚本标签,其中包含一个带有不完整候选列表的面板。
我的问题有两个:
- 是否有意义使用"站点"one_answers"测试"作为状态,然后使用某种AJAX脚本来获得不完整候选人的数组,或者是在更好的风格,简单地设置不完整候选人的数组为状态。 如何在不使用Ajax的情况下设置这个初始状态?是否有一种方式我直接从PHP传递状态到我的react.js组件或通过一个变量从smarty到react.js。
关于我的第一个问题,我认为我需要更好地掌握状态,但从我的理解和我在这里读到的:如果一个组件需要在某个时间点改变它的一个属性,该属性应该是它的状态的一部分,否则它应该只是该组件的一个道具。
从我的角度来看,这个状态是访问和测试,它决定了应该列出哪些用户。
如果我的想法有缺陷,我希望有人能告诉我。我还在想怎么反应。
欢呼。
使用"site"one_answers"test"作为状态是否有意义
如果它们在运行时发生变化,它们应该是状态的,并且该组件应该在逻辑上拥有它们(没有父组件关心它们的当前值,或者没有父组件)。
如果这个组件是逻辑所有者,它们应该是实例属性,并且它们不影响渲染。
否则:道具。
,然后使用某种AJAX脚本来获得不完整候选数组,或者将不完整候选数组简单地设置为状态
如果您需要根据变化的参数获取新数据,ajax是实现它的方法。我不确定你的问题是什么,因为你说"……或者是更好的样式…",但您会调用ajax,然后将结果置于状态。
如何在不使用Ajax的情况下设置这个初始状态?
你把它放在一个全局变量(json在脚本标签),或一个元素的data-foo属性,JS读取它,并在getInitialState中使用它。
在这里我实现了一个jsx脚本标签
如果您在客户端上使用JSXTransformer,它必须加载一堆代码,然后搜索脚本标记,标记并将脚本解析为AST,对代码执行一些转换,从修改后的AST生成字符串,然后执行它。
它是一个很好的开发工具,但不适合用于生产。替代方案是不使用JSX,或者提前将其编译为纯JS,然后让php发送。