我试图找到从组件状态中的数组中删除元素的最佳方法.既然我不应该this.state直接修改变量,那么从数组中删除元素是否有更好的方法(更简洁)?
onRemovePerson: function(index) {
this.setState(prevState => { // pass callback in setState to avoid race condition
let newData = prevState.data.slice() //copy array from prevState
newData.splice(index, 1) // remove element
return {data: newData} // update state
})
},
Run Code Online (Sandbox Code Playgroud)
谢谢.
更新
这已更新为使用setState中的回调.这应该在更新时引用当前状态时完成.
我使用webpack和HtmlWebpackPlugin将捆绑的js和css注入到html模板文件中.
new HtmlWebpackPlugin({
template: 'client/index.tpl.html',
inject: 'body',
filename: 'index.html'
}),
Run Code Online (Sandbox Code Playgroud)
它会生成以下html文件.
<!doctype html>
<html lang="en">
<head>
...
<link href="main-295c5189923694ec44ac.min.css" rel="stylesheet">
</head>
<body>
<div id="app"></div>
<script src="main-295c5189923694ec44ac.min.js"></script>
</body>
</html>
Run Code Online (Sandbox Code Playgroud)
这在访问应用程序的根目录时工作正常localhost:3000/,但是当我尝试从另一个URL访问应用程序时失败,例如,localhost:3000/items/1因为捆绑的文件没有注入绝对路径.加载html文件时,它将在不存在的/items目录中查找js文件,因为react-router尚未加载.
如何让HtmlWebpackPlugin注入具有绝对路径的文件,所以express将在我的/dist目录的根目录中查找它们而不是在/dist/items/main-...min.js?或者也许我可以更改我的快速服务器来解决这个问题?
app.use(express.static(__dirname + '/../dist'));
app.get('*', function response(req, res) {
res.sendFile(path.join(__dirname, '../dist/index.html'));
});
Run Code Online (Sandbox Code Playgroud)
基本上,我只需要得到这条线:
<script src="main...js"></script>
Run Code Online (Sandbox Code Playgroud)
在源的开头有一个斜杠.
<script src="/main...js></script>
Run Code Online (Sandbox Code Playgroud) 我正在尝试使用代码格式化工具格式化整个 repo。这样做时,我想保留有关谁提交了哪一行的信息,以便像这样的命令git blame仍然显示正确的信息。我的意思是它应该显示之前编辑过每一行的作者(在格式化之前)。
有 git filter-branch 命令,它允许您从时间开始对 repo 的每个修订版运行命令。
git filter-branch --tree-filter '\
npx prettier --write "src/main/web/app/**/**.{js, jsx}" || \
echo "Error: no JS files found or invalid syntax"' \
-- --all
Run Code Online (Sandbox Code Playgroud)
运行它需要很长时间,而且我真的不在乎过去。我只想在不更改每一行的所有权的情况下格式化 master 分支。我怎样才能做到这一点?我尝试使用rev-list最后的和其他过滤器类型,但它仍然不起作用。必须有一种方法来格式化代码库,同时保留每一行的作者信息。
我试图在一个对象中深入分配一个值.例如:
const errors = {}
if(errorOnSpecificField) {
// TypeError: Cannot read property 'subSubCategory' of undefined(…)
errors.subCategory.subSubCategory.fieldWithError = 'Error Message'
}
Run Code Online (Sandbox Code Playgroud)
现在,没有lodash,我可以这样做:
const errors = {}
if(errorOnSpecificField) {
errors.subCategory = errors.SubCategory || {}
errors.subCategory.subSubCategory = errors.SubCategory.subSubCategory || {}
errors.subCategory.subSubCategory.fieldWithError = 'Error Message'
}
Run Code Online (Sandbox Code Playgroud)
有了lodash,我可以这样做:
const errors = {}
if(errorOnSpecificField) {
_.set(errors, 'subCategory.subSubCategory.fieldWithError', 'Error Message');
}
Run Code Online (Sandbox Code Playgroud)
我试图避免使用第三方库.是否有更优雅的解决方案,特别是现在es2015有对象解构.逆操作很简单:
let {subCategory : {subSubCategory: {fieldWithError}}} = errors
Run Code Online (Sandbox Code Playgroud)
什么是深层对象分配的优雅解决方案?谢谢!
使用 Puppeteer,如何让无头 chrome 浏览器下载文件(或发出额外的 http 请求并保存响应)?
我怀疑答案是否定的,但我想我还是会问。有没有办法检测移动设备上的浏览器(例如 Android 上的 Chrome)是否正在使用 WiFi 或蜂窝数据连接到互联网?
我正在尝试在我的Mac上使用本地服务器,但似乎忽略了/ etc/hosts文件中的localhost设置.找到几个解决方案要重新安装的页面,并将localhost放到/ etc/hosts等的第一个位置......我相信这些不仅仅是需要的.
有人还有同样的问题吗?
javascript ×4
browser ×1
ecmascript-6 ×1
express ×1
formatting ×1
git ×1
localhost ×1
mobile ×1
osx-lion ×1
prettier ×1
puppeteer ×1
react-router ×1
reactjs ×1
web-scraping ×1
webpack ×1