反应大师的快速问题;)
React.Children.only是它的顶级api之一,并且通常被react-redux(<Provider />)和React Router(<Router />)用来注入商店/路由器作为上下文,这背后的原因是什么,为什么不简单return props.children呢？似乎与JSX有关？
编辑:请不要解释什么是React.Children.only,我问为什么使用它而不是props.children,这似乎更强大/灵活.
曾几何时,有很多激烈的争论<script>在<head>或<body>.
许多SO帖子已经指出了最佳实践/经验法则是<script>在<body>不阻止html解析器之前放置前端,从而更快地获得第一次屏幕绘制和更快的客户端DOM访问,从而获得更好的用户体验.
这必须是重复的("□")╯
等等...... 现在<script>可以deferred,实际上已经有一段时间了!
老帖说
延迟脚本可能会导致JS依赖问题
不,它不会.它在解析DOM时立即保留执行顺序.
它不适用于跨供应商
是的,它曾经是,但今天它几乎得到了所有主要浏览器供应商的支持:http://caniuse.com/#search=defer,除了评论指出IE <10之外可能还有一些问题.
然而,它提供的好处似乎是显而易见的,至少在我看来,因为它在早期(在开始解析DOM之前)并行下载脚本,因此不需要稍后请求脚本并缩短整个脚本所需的时间.页面互动.
简而言之,这个问题类似于:任何不使用的好理由
<head>
...
<script src='cdn/to/jquery' defer>
<script src='cdn/to/bootstrap' defer>
<script src='script/depends/on/jqueryandbootstrap' defer>
</head>
而是使用这个:
<body>
...
<script src='cdn/to/jquery'>
<script src='cdn/to/bootstrap'>
<script src='script/depends/on/jqueryandbootstrap'>
</body>
注意:这可能是一个有很多讨论的"古老"话题.但是,随着Web技术的快速发展,浏览器供应商更好地与新的Web规范保持一致,许多旧的stackoverflow答案可能无法保持最新.
这似乎使道具还没有得到足够的牵引力,到目前为止,然而,它的广泛使用,久负盛名的反应的库,例如react-router 4,react motion等和应对网站也有这方面的专门一节,任何原因出现的模式,如何进行比较,俗称HOC(高阶分量)模式？
使用PureComponent来改善React中的渲染性似乎是一种常见的技术.但是,使用具有子项作为道具的PureComponent时似乎并非如此.
class App extends React.PureComponent {
render() {
console.log('re-render')
return <div>{this.props.children}</div>
}
}
const render = () => {
ReactDOM.render(
<App>
<div />
</App>,
document.getElementById('app')
)
setTimeout(render, 1000)
}
render()
结果是控制台每1秒保持记录"重新渲染".似乎children(<div />)是上面App组件的唯一支柱并且永远不会改变,为什么App仍然会被重新渲染？
注意:如果有任何混淆,问题是相同的,为什么上面的PureComponent的SCU(shouldComponentUpdate)钩子返回true,因为没有道具似乎改变了？
这是我第一次注意到vim中的选择模式,当我意外地从visual-line模式触发它时<c-g>.
Vim已经visual mode为文本选择提供了什么用例selection mode,有人能给我一个提示吗？
(注意:我已经检查过将其描述为的手册页
MS Windows文本选择的相似之处
但我还是不太明白为什么我们在vim中需要任何鼠标操作)
我不仅可以从项目根目录还可以从子文件夹运行 NPM 脚本，这很好。但是，受限于它不能告诉我当前的工作路径 ($PWD)。
假设有一个这样的命令：
"scripts": {
...
"pwd": "echo $PWD"
}
如果我npm run pwd在项目根目录的子文件夹中运行（例如，$PROJECT_ROOT/src/nested/dir），它不会打印出我当前的路径$PROJECT_ROOT/src/nested/dir，而是总是$PROJECT_ROOT返回。有没有办法告诉 NPM 脚本使用我当前的工作目录而不是解析到package.json所在的位置？
基本上，我想将 Yeoman 生成器拉入现有项目并通过 NPM 脚本使用它，以便每个人都可以使用共享知识（例如npm run generator），而不是学习任何特定于 Yeoman 的东西（例如npm i yo -g; yo generator）。由于生成器根据当前工作路径生成文件，而 NPM 脚本始终解析为项目根目录，因此我无法在打算使用的地方使用生成器。
我有...
Node.js / express服务器，当对某些路由发出请求时，该服务器提供文件。
反应页面以调用后端请求数据来填充页面。
我在前端使用react-router v4。每当我导航到不在确切路径上的路线并重新加载页面时，都会收到404错误。我了解为什么这行不通；浏览器向由react-router处理的路径发出请求，由于它在服务器上找不到该路由，因此得到404。
我正在寻找解决此问题的方法。
// BrowserRouter imported as Router
<Router>
<Route exact path='/main' component={Main} />
<Route path='/sub1' component={SubOne} />
<Route path='/sub2' component={SubTwo} />
</Router>
当我/main在浏览器中转到时，<Main />将呈现。都说里面<Main />，有链接/sub1和/sub2分别。我点击/sub2。组件和页面内容的渲染不会失败。然后，我偶然或有意刷新页面（例如，组件Sub2将状态提升到Main）。
如何避免在刷新后收到404？如果我使用React-Router，如何在刷新后获得呈现“我”的页面/组件？
我的json数据是这样的:
[{"vehicleType":"car","make":"Dodge","model":"Durango","vin":"R90N8E95UB"},
{"vehicleType":"car","make":"Honda","model":"Accord","vin":"XJLSXU6NA5"},
{"vehicleType":"car","make":"Dodge","model":"Durango","vin":"2UNHFBCQG0"},
{"vehicleType":"car","make":"Volvo","model":"XC90","vin":"J37612ZVEC"},
{"vehicleType":"car","make":"Mercedes","model":"C250","vin":"J5QB24CFGS"},
{"vehicleType":"car","make":"Dodge","model":"Durango","vin":"OB60BC33LF"},
{"vehicleType":"car","make":"Volvo","model":"XC90","vin":"DCA3364SGK"},
{"vehicleType":"car","make":"Volvo","model":"XC60","vin":"FV2HML056G"},
{"vehicleType":"car","make":"BMW","model":"328xi","vin":"IGPP3DQ4SK"},
{"vehicleType":"car","make":"Mercedes","model":"C250","vin":"J5QB24CFGS"},
{"vehicleType":"car","make":"Honda","model":"Accord","vin":"XJLSXU6NA5"},
{"vehicleType":"car","make":"Mercedes","model":"C250","vin":"J5QB24CFGS"},
{"vehicleType":"car","make":"Dodge","model":"Durango","vin":"R90N8E95UB"}]
现在我希望我的数组在JavaScript中像这样:
// Javascript array
var array = [];
array[// vin number od above json array] = // the whole row of that vin number.
例如.,
// Javascript array
array["R90N8E95UB"][0]
=[{"vehicleType":"car","make":"Dodge","model":"Durango","vin":"R90N8E95UB"}]
array["R90N8E95UB"][1]
=[{"vehicleType":"car","make":"Dodge","model":"Durango","vin":"R90N8E95UB"}]
等等...
请提出建议.
谢谢.
reactjs ×4
javascript ×3
react-router ×2
children ×1
components ×1
html5 ×1
json ×1
npm-scripts ×1
performance ×1
pwd ×1
react-dom ×1
react-redux ×1
render ×1
vim ×1
yo ×1