- 我有一个原型(prototype),当我们点击该图标时,文本框会打开..
- 以同样的方式在我的代码库中,我试图让我的测试框关闭和打开...
- 这里我使用的是图像而不是 css 中的图标
- 我在我的代码库中使用相同的原型(prototype)代码..
- 但它不起作用...
我认为下面一行有问题 div className={
icon-search-container ${this.state.active ? '活跃':''}
}>在我的原型(prototype)代码中,它们呈现在
- 在我的代码库中,我不确定在哪里渲染 -在 fiddle 中提供原型(prototype)和我的代码库
- 我什至减少了 css,但仍然无法找到 :(
原型(prototype)代码 - 工作 http://codepen.io/tasssik/pen/yeGozR
无效代码 http://codepen.io/anon/pen/zrymwq
main code to be fixed
<div className={`icon-search-container ${this.state.active ? 'active' : ''}`}>
<a onClick={this.handleClick} href="javascript:;" className="fa fa-search sportsTopSection-navUtilities-search">
<span className="hidden">Search <abbr>NBA</abbr>.com</span>
</a>
<input type="text" ref='search'className="search-input" placeholder="Search" onBlur={() => this.setState({active: false})}/>
<span className="fa fa-times-circle"
onClick={() => this.setState({active: false})}>
</span>
</div>
最佳答案
不工作的例子有点长而且乱,所以也许我错过了,但我不认为你在打电话 React.render()
,所以这是一个大问题。此外,自定义组件必须以大写字母开头:<SportsTopSection />
, 不是 <sportsTopSection/>
.
编辑以响应更清晰的代码: 好吧,简短的回答是“它没有渲染,因为它首先抛出错误。”为什么它首先出错?该错误显示“未定义导出”。我不使用 CodePen,但如果导入和导出在其中工作,我会感到惊讶。您查看过这是否是问题所在吗?
关于javascript - 为什么 React 中的过渡函数无法渲染?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/35347697/