我将一个小脚本移植到React。这是一个简单的国家/地区选择器插件,将国家下拉菜单和区域下拉菜单联系在一起,所以后者总是显示所选国家的相关区域。参见:https://github.com/benkeen/country-region-selectorReact组件设计
事情是,我无法想象使用React进行组件化的最佳方法。我需要两个关键元素(国家下拉菜单和区域下拉菜单)完全独立,因此用户可以精确选择DOM +周围标记中出现两个下拉菜单的位置。但是我希望所有的内部工作(即两个组件如何连接在一起)隐藏起来。我在想也许是这样的...
<CountryRegions>
<span>arbitrary markup here</span>
<CountryDropdown />
<p>
<RegionDropdown />
</p>
</CountryRegions>
......但我很朦胧的如何实际执行的工作。任何想法/更好的建议?希望这个问题很明确。
你是说你希望你的国家选择器是两个React组件,它们可能都存在于HTML中(即两个'ReactDOM.render()'调用),或者整个应用程序是React,并且你希望组件存在于任何地方应用程序? – Aaron
不确定我是否遵循...基本上我不希望用户必须将两个下拉线连接在一起。例如保持所选国家的下拉菜单+将该值传递给区域下拉菜单。相反,我想允许用户只包含那个 组件,其中包含两个下拉列表中的任何标记。这会使组件非常容易“插入”到React应用程序中。 –
好吧,这听起来像组件存在于同一个React应用程序中,我只是不确定你是否想要在单独的HTML容器中混合使用传统HTML页面中的React元素。 – Aaron