小编Jos*_*eau的帖子

如果元素是从无状态功能组件创建的,则告知

我是React Flip Move的所有者,React Flip Move是一个小型库,可帮助重新排序DOM节点时进行动画转换.

它的工作原理是使用refs; 我克隆了提供的children并附加了一个ref函数,该函数将授予我对底层节点的访问权限,并且我根据需要使用该引用进行必要的动画处理.

但是,无状态功能组件不支持refs.当它通过SFC时,它会抛出异常.

当前的错误消息非常无用,我想提供更明确的警告.问题是,我不知道如何判断是否从SFC创建了React元素.检查props.children,他们看起来几乎相同.

我当然可以通过在try/catch中包装第一个调用来解决这个问题,但是我希望比那更明确(同样,我也不想等到第一次动画尝试才触发自定义错误消息).

javascript reactjs

9
推荐指数
1
解决办法
205
查看次数

嵌套循环React组件与Flux,父级或子级的更改侦听器?

我正在React/Flux中构建一个Word Dojo克隆.游戏本质上是Boggle - 您通过单击网格中的相邻字母来创建单词:

在此输入图像描述

我的React组件及其来源:

  1. 游戏板
  2. TileColumn

所有源代码都可以在这里查看.


它现在如何工作:

有一个GameStore,它包含一个二维javascript对象数组.对象具有'letter'字符串值和'active'布尔值.当用户单击一个字母时,会调度到GameStore,后者会更新该二维数组并发出Change事件.

GameBoard组件侦听该更改事件,然后重新渲染10个TileColumns,每个TileColumns渲染10个Tiles.GameBoard将商店的数据作为其状态的一部分,并且tile具有自己的字母/活动状态作为道具.

问题是更改1个字母会导致重新渲染所有100个图块.


shouldComponentUpdate

我尝试在Tile上使用shouldComponentUpdate来指定它只应在其"活动"值发生变化时才更新,但问题是this.props.active和nextProps.active都是相同的值:要么它们都是假的,或两者都是真的.


推迟对孩子们的责任

我的另一个想法是让每个Tile负责自己的更新,直接在tile上注册更改侦听器.我收到一个警告,我超过了监听器的数量,看起来好像100个更改监听器,所有触发每个字母更新的效率都会降低.虽然这只是Javascript,所以我们要避免一些DOM操作......


性能

我启动了Profiler,现在,在父母完成所有状态管理的情况下,它需要40ms才能在信件点击时重新渲染整个电路板.这还不错,但是当游戏变得更复杂时,我担心它会变得明显延迟.


需要帮助

具体来说,我正在寻找有关这种情况下最佳实践的建议(当你有嵌套的,迭代的组件时),如果shouldComponentUpdate 解决方案,但我只是错误地使用它.

谢谢!

javascript performance reactjs reactjs-flux

8
推荐指数
1
解决办法
1143
查看次数

Vue中JS和SCSS之间的共享变量

我最近开始使用Vue.js 2,并且喜欢单文件组件结构:

<template>
  <h1>Hello World</h1>
</template>


<script>
export default {
  name: 'hello-world',
};
</script>


<style scoped lang="scss">
h1 {
  font-size: 72px;
}
</style>
Run Code Online (Sandbox Code Playgroud)

不过,我很好奇是否存在一种在SCSS和JS之间传递变量的既定方法。我需要共享一个值,现在在两个部分中都重复了一个值。

我使用Vue CLI创建了这个项目,因此使用vue-loader将其与Webpack 2捆绑在一起。我希望有一种方法可以配置它以将变量从JS填充到SCSS,反之亦然。

javascript sass vue.js vuejs2

6
推荐指数
1
解决办法
2055
查看次数

指定`env`时,childProcess.spawn失败

我正在使用Node的childProcess模块​​来尝试运行NPM任务.

当我执行以下操作时,一切工作文件:

  const child = childProcess.spawn('npm', ['run', taskName], {
    cwd: `${parentPath}/${projectId}`,
  });
Run Code Online (Sandbox Code Playgroud)

但是,我需要为命令提供环境变量才能成功.我尝试使用这个env参数,如下:

  const child = childProcess.spawn('npm', ['run', taskName], {
    cwd: `${parentPath}/${projectId}`,
    env: {
      ...process.env,
      PORT: 4545,
    }
  });
Run Code Online (Sandbox Code Playgroud)

当我这样做时,我收到以下错误:Uncaught Error: spawn npm ENOENT.

事实证明,无论env值是什么,无论命令是什么,我都会收到此错误.例如:

  const child = childProcess.spawn('which', ['npm'], {
    cwd: `${parentPath}/${projectId}`,
    env: process.env,
  });
Run Code Online (Sandbox Code Playgroud)

此代码失败Uncaught Error: spawn which ENOENT.换句话说,当任何值设置为env,则生成的进程失败,因为甚至内置命令which都是未知的.

编辑:也许值得一提的是我正在使用Electron.我知道Electron以某种方式融合了Node和Chromium,所以也许这有些怪癖?

shell child-process node.js electron

6
推荐指数
1
解决办法
606
查看次数

使用自然语言处理从推文中提取地址

我正在构建一个Twitter机器人,它将收听如下推文:

Hey @twitterbot, I'm looking for restaurants around 123 Main Street, New York
Run Code Online (Sandbox Code Playgroud)

或者,另一个例子:

@twitterbot, what's near Yonge & Dundas, Toronto? I'm hungry!
Run Code Online (Sandbox Code Playgroud)

然后,它将回复您希望这些问题返回的数据类型.我已经解决了大部分问题,但我仍然坚持不应该那么难的事情; 从推文中提取地址.

我将转发地址到地理编码服务以获取lat/lng,因此我不需要以任何方式格式化或准备地址; 我只需要将它与不相关的文字隔离开来,比如"我正在寻找周围的餐馆"或"我很饿!".

是否有任何NLP工具可以在一个文本块中执行此地址识别?有关于另一种方式的建议吗?因为谷歌的地理编码器处理如此广泛的地址格式(甚至像'伊顿中心,多伦多'作为一个地址),我不能使用正则表达式来解决这个问题.

换句话说,我只想删除任何不属于地址的文本.

我正在寻找的地址需要在美国/加拿大工作.

StackOverflow上有一些类似的问题,但没有一个能解决我能找到的这个问题.因为谷歌的地理编码器是如此宽容,解决方案不一定是完美的,它只需要摆脱足够的模糊,以便谷歌知道我想说的是什么.

我对NLP很新,所以我很欣赏有关这个主题的任何指导.

google-maps nlp machine-learning street-address

4
推荐指数
1
解决办法
2701
查看次数