小编Bra*_*don的帖子

如何在没有"快速失败"行为的情况下等待多个并行承诺?

我正在使用async/ 并行await触发多个api调用:

async function foo(arr) {
  const results = await Promise.all(arr.map(v => {
     return doAsyncThing(v)
  }))
  return results
}
Run Code Online (Sandbox Code Playgroud)

我知道的是,不同于loops,Promise.all 执行并行(即,等待换结果部分是并行地).

我也知道:

如果其中一个元素被拒绝且Promise.all快速失败,则Promise.all被拒绝:如果有四个promise在超时后解析,并且一个立即拒绝,则Promise.all立即拒绝.

当我读到这个时,如果我Promise.all有5个承诺,并且第一个完成返回a reject(),那么其他4个被有效取消并且它们的承诺resolve()值将丢失.

还有第三种方式吗?执行是否有效并行,但单一故障不会破坏整个群体?

javascript asynchronous promise async-await

45
推荐指数
2
解决办法
4万
查看次数

Intellij插件:AirBnB ESLint w/React

在Ubuntu 15.10上使用Intellij Idea 15.0.2并尝试配置ESLint工作.

遵循Jetbrains网站上的说明,但没有骰子.

这是我在语言和框架设置的屏幕截图 > javascript>代码质量工具> ESLint.这是 IntelliJ中我的nodejs/npm设置的屏幕截图.

和我的.eslintrc文件,在根项目目录中:

{
  "extends": "airbnb",
  "rules": {
    "comma-dangle": 0
  }
}
Run Code Online (Sandbox Code Playgroud)

这是一个剪辑,/index.js它在IntelliJ中不会产生任何错误或警告:

var superman = {
    default: { clark: "kent" },
    private: true
};
Run Code Online (Sandbox Code Playgroud)

这是我eslint index.js从终端运行时的输出:

   4:1   error    Unexpected var, use let or const instead                      no-var
   5:5   error    Expected indentation of 2 space characters but found 4        indent
   5:23  error    Strings must use singlequote                                  quotes
   6:5   error    Expected indentation of …
Run Code Online (Sandbox Code Playgroud)

javascript intellij-idea reactjs eslint

12
推荐指数
1
解决办法
1万
查看次数

有没有办法在Elm中使用React组件?

我知道使用Elm组件("模块"?仍在学习用语)React是一个已建立的模式react-elm-components,但有没有办法做反向?

例如,这样的事情是可能的:

Top-level React App
 -> React layout/component
    -> Elm components
Run Code Online (Sandbox Code Playgroud)

但是这个怎么样:

Top-level Elm App
  -> Elm layout/components
     -> React components
Run Code Online (Sandbox Code Playgroud)

如果可能的话,'榆树底部'模式是否优越?试图解释为什么似乎没有关于它的文献,这是一个可能的解释.

elm reactjs

10
推荐指数
2
解决办法
2051
查看次数

从嵌套的async/await函数中捕获错误

我在node 4.3脚本中有一个函数链,类似于回调 - >承诺 - > async/await - > async/await - > async/await

像这样:

const topLevel = (resolve, reject) => {
    const foo = doThing(data)
    .then(results => {
        resolve(results)
    })
    .catch(err => {
        reject(err)
    })
}

async function doThing(data) {
    const thing = await doAnotherThing(data)
    return thing
}

async function doAnotherThing(data) {
    const thingDone = await etcFunction(data)
    return thingDone
}
Run Code Online (Sandbox Code Playgroud)

(之所以不async/await完全是因为顶级函数是一个任务队列库,表面上不能运行async/await样式)

如果etcFunction()抛出,error泡沫一直上升到顶层Promise吗?

如果没有,我怎么能冒泡errors?我需要每个包装awaittry/catch …

javascript node.js async-await ecmascript-2017

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

React:将组件存储在对象中

我的用户配置文件中有几十个字段,我正在尝试构建一种有效的方法来在适当的输入表单组件中显示它们。

例如,配置文件可能如下所示:

profile1={
  name: 'Cornelius Talmadge',
  phone: '1'
}
Run Code Online (Sandbox Code Playgroud)

如果我可以像这样堆叠组件......

export const FieldCatalogue = {
  name: <TextField defaultValue={this.state.userProfile.name} label={"Name"} />
}
Run Code Online (Sandbox Code Playgroud)

...然后我可以做这样的事情:

for (let field in Object.keys(profile1)) {
  return FieldCatalogue[field]
}
Run Code Online (Sandbox Code Playgroud)

这将是非常酷的。

Component = React.createClass({..})如果我的输入组件都是通过正常语法(例如, )构造的,那么这个问题有一个很好的答案,但是:

A。有很多样板文件

b. 我必须向每个人传递大量道具,这不是最佳选择

对我来说,完美的情况基本上是将输入组件几乎作为字符串传递,这样它们就会落入它们渲染的任何父组件的范围(状态、道具等)中。

这可能和/或可取吗?

reactjs

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

Firebase:如何有效跟踪用户/记录更改历史记录

[ 很多关于SO的讨论,但是几乎所有关于SQL的讨论都是如此,所以根据我的判断,我的问题很多都是N/A ]

我正在用react/ redux,firebase后端和AWS lambda必要的函数编写CRUD应用程序.

我的用户将有兴趣了解已更改的内容以及何时记录,但我正在努力寻找一种有效的方法.

我目前的计划是保持"记录更新"记录的集合与像场previousVal,changeDateuserMakingChange. Redux有一些很棒的中间件可以在客户端使这个相当简单.

img是我想到的数据库模式.Firebase强调非常扁平的数据结构,我希望修订历史按需加载,与用户/记录分开,因此中间表revision histories.

所以,我的问题:

  1. 修订历史记录系统如何处理膨胀的存储要求?
  2. 是否有一种不太复杂的方法来做到这一点?我认为必须有一个行业'最佳实践'这样的事情.

我正在考虑的架构草图

database database-schema firebase

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

如何在Electron中编译带webpack的预加载脚本?

Electron 1.6.5,Webpack 2.4.1

我正在使用带有组件的电子反应样板webview.我注入了一个preload脚本webview,就像这样:

const { ipcRenderer } = require('electron');
const doSomething = require('./utils/do-some-thing.js');

document.addEventListener('DOMContentLoaded', event => {
   doSomeThing()

  // tell scraper to get started
  ipcRenderer.sendToHost('THING IS DONE', [{ url: document.URL }]);
});
Run Code Online (Sandbox Code Playgroud)

webview需要将此脚本作为file://路径传递,如下所示:

       <webview
        preload={'./some/folder/preload.js''}
        {...props}
      />
Run Code Online (Sandbox Code Playgroud)

问题是我的webpack设置没有转换,preload.js因为它没有明确调用via require().然后,当我构建应用程序时,路径./some/folder/不存在.

我已经尝试设置webpack来创建第二个编译脚本,如下所示:

entry: [
    'babel-polyfill',
    './app/index',
    './some/folder/preload.js'
  ],

  output: {
    path: path.join(__dirname, 'app/dist'),
    publicPath: '../dist/'
  },
Run Code Online (Sandbox Code Playgroud)

但这会导致JavaScript heap out of memory错误,这让我相信这是不正确的.

另外:这个方法不会electron./dist文件夹中重复,因为它是 …

javascript webpack electron

8
推荐指数
2
解决办法
771
查看次数

如何在React Material-UI中应用字体主题?

我正在尝试将谷歌字体应用于我的Material-UI反应项目,但似乎无法让它采取.我正在使用mui 0.14.2.

我的index.html字体加载: <link href='https://fonts.googleapis.com/css?family=PT+Sans:400,700' rel='stylesheet' type='text/css'>

我应用主题的组件:

import ThemeManager from 'material-ui/lib/styles/theme-manager';
import LightRawTheme from 'material-ui/lib/styles/raw-themes/light-raw-theme';

const App = React.createClass({

    childContextTypes: {
        muiTheme: React.PropTypes.object,
    },
    getChildContext: function() {
        return {
            muiTheme: ThemeManager.modifyRawThemeFontFamily(ThemeManager.getMuiTheme(LightRawTheme), 'PT Sans, sans-serif')
        }
    },

...etc etc

}
Run Code Online (Sandbox Code Playgroud)

reactjs material-ui

7
推荐指数
2
解决办法
2万
查看次数

盖茨比静态网站gen.并发布新内容

使用Gatsby静态站点生成器项目,由于站点在webpack构建期间将内容文件呈现为html,这是否意味着对于类似博客的内容,每个新帖子都需要重新推送到服务器?

如果是这种情况,是否有人拥有该工作流程的最佳实践?

gatsby

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

如何阻止 Material-UI 工具提示隐藏在相邻的祖先元素下?

我的 DOM 是这样的:

wrapper
-element-container
--element (many)
---iconButton
Run Code Online (Sandbox Code Playgroud)

每当 anelement靠近 的边界时element-containertooltip渲染就会在 的边界处被截断element-container

如何确保tooltips始终出现在顶部?

这是我当前的内联样式:

element-container: {
        paddingTop: '15px',
        height: '65vh',
        overflowY: 'scroll',
      },
element: {
        border: this.props.isSelected ? '4px solid #E71E61' : 'none',
        boxSizing: 'content-box',
        width: '300px',
        transition: 'width 1.5s',
        height: '500px',
        margin: '15px',
        position: 'relative',
      },
iconButton: {
        position: 'absolute',
        marginTop: '-30px',
        marginLeft: '-30px',
        transform: this.state.isMouseOver === true ? 'scale(1,1)' : 'scale(0,0)',
        transition: 'all .2s',
      },
icon: {
        height: …
Run Code Online (Sandbox Code Playgroud)

css reactjs material-ui

5
推荐指数
0
解决办法
2768
查看次数