小编Nic*_*eda的帖子

我不明白使用IndexRoute和IndexLink的目的是什么.似乎在任何情况下,除非关闭路径被激活,否则下面的代码将首先选择Home组件.

<Route path="/" component={App}>
  <IndexRoute component={Home}/>
  <Route path="about" component={About}/>
</Route>

VS

<Route path="/" component={App}>
  <Route path="home" component={Home}/>
  <Route path="about" component={About}/>
</Route>

第一种情况的优势/目的是什么？

Egghead教程教导它像这样:

var React = require('react');
var Router = require('react-router');
var routes = require('./config/routes');

Router.run(routes, function(Root){
  React.render(<Root />, document.getElementById('app'));
});

但是我得到了这个错误:

未捕获的TypeError:Router.run不是函数

注意:我已经更新react-router到最新版本.

我是Redux的新手 - 而且我真的想要全面了解使用函数式编程来使单向数据更加优雅.

我看到它的方式 - 每个减速器都采用旧状态,创建一个新状态而不改变旧状态,然后将新状态传递给下一个减速器以执行相同操作.

我认为这不会导致副作用,这有助于我们获得单向数据流的好处.

我真的没有得到不改变旧状态的重要性.

我唯一能想到的可能是我读过的"时间旅行",因为如果你坚持每个州,你就可以表演并"撤消".

题:

还有其他原因导致我们不想在每一步都改变旧状态吗？

问题:我有很多小辅助函数,它们不一定需要存在于一个组件中(或者可能它们可以但是它们会使该组件膨胀很多代码).我懒惰的一方只是想让那些全部只是某些组件可以调用的全局函数.我真的想要制作好的ReactJs代码.

问题:Reactjs中全局帮助函数的最佳实践是什么？我应该强迫它们进入某种组件还是将它们推入其他组件？

基本示例:

function helperfunction1(a, b) {
    //does some work
    return someValue;
}

function helperfunction2(c, d) {
    //does some work
    return someOtherValue;
}

function helperfunction3(e, f) {
    //does some work
    return anotherValue;
}

function helperfunction4(a, c) {
    //does some work
    return someValueAgain;
}


var SomeComponent =
    React.createClass({

        //Has bunch of methods

        //Uses some helper functions

        render: function () {

        }

    });

var SomeOtherComponent =
    React.createClass({

        //Has bunch of methods

        //Uses some helper functions

        render: function () {

        }

    });

情况:

我有一个简单的导航栏,我正在Flexbox中构建.我想将一个项目向左浮动,并将其他项目固定在右侧.

例:

<nav>
  <ul class="primary-nav">
    <li><a href="#" id="item1">ListItem1</a></li>
    <li><a href="#" id="item2">ListItem2</a></li>
    <li><a href="#" id="item3">ListItem3</a></li>
    <li><a href="#" id="item4">ListItem4</a></li>
  </ul>
</nav> 

问题

通常答案只涉及左右浮动项目,但据推测,在Flexbox中使用Floats是不好的.我正在考虑使用justify-content并使用flex-start和flex-end,但这样做并不是很好.

我尝试将flex-start应用于第一个项目,然后将flex-end应用于其他项目但是效果不佳.

喜欢如此:

.primary-nav #item1 {
  justify-content: flex-start;
}

.primary-nav #item2 {
  justify-content: flex-end;
}

.primary-nav #item3 {
   justify-content: flex-end; 
}

.primary-nav #item4 {
    justify-content: flex-end;    
}

赞赏并感谢任何拥有Flexbox技能的人,并且可以帮助我了解处理这种情况的正确方法.:)

工具:Chrome开发者工具,ReactJs和Webpack

也许是在我切换到与webpack捆绑时,但最初当我开始我的项目时,我能够将我的js捆绑到一个bundle.js文件中,但仍然可以访问浏览器调试工具中的文件.现在,我在js文件夹中的浏览器中看到的是bundle.js

使用webpack如何回到能够在浏览器调试器中看到我的所有Javascript文件,以便我可以执行插入断点等操作？

我对当天的好奇心之一.

我意识到findOneAndUpdate确保了原子操作,所以我假设updateOne没有.

但我真的不知道避免原子的巨大好处可能超过花费额外时间推理和检查更新是否是原子的成本.

一些见解或用例示例会很棒!

语言:JavaScript

递归 - 不是我最喜欢的主题.

承诺 - 他们可能会混淆.

递归+承诺 - 我需要在一个带衬垫的房间里编程.

我制作了这个小小的JS Fiddle拼图,我把RecursiveFunHouse称为通过将问题简化为愚蠢而保持理智的喜剧方式.希望yall可以从我的痛苦中笑出来:)

问题:

每个递归调用都依赖于前一个调用的结果,但为了获得结果,我必须运行异步任务并在其他子任务中使用该结果.

"Recursive Fun House"帮助我将问题归结为此 - 原始递归循环继续使用未定义的值,因为子任务仍在执行.

Fun House - 围绕收集(-99)和99之间的随机数循环.一旦最后一个数字和新数字之间的最后一个差异是积极的,乐趣就结束了

打印"在这里制作1 ...在这里制作6"应该表明子任务处理正确,我们有一个下一个循环的值.

目前它打印1,2,3,6,4,5 :(

recursiveFunHouse.js

var recursiveFunHouse = function(num){
    console.log("Made it here 1");
    var newNum = performSideTasks();

    console.log("Made it here 6");
    console.log("newNum");
    console.log(newNum);
    if(newNum-num >0 ){
            recursiveFunHouse(newNum);
    }
    else{
        console.log("The FunHouse Generated These Numbers :")
      for(var i = 0; i <numList.length; i++){
         console.log(numList[i]);
      }
    }

};

var performSideTasks = function(){
    console.log("Made it here 2");
    someAsyncTask().then(function(num){ …

mongodb 2.1.4(节点驱动程序)

我正在尝试为插入到数组中的每条消息创建一个新的ObjectID(该数组是一个子文档).

我这样想 - 可以轻松地对阵列中的每条消息执行所有CRUD操作.

例如:

"threads"集合(注意 - 每条消息的ObjectId)

{
    "_id": ObjectId("1234132413424123"), //A thread id
    messages:[
        {
            _id :ObjectId("134124412341234"),// A message id
            "message":"MongoDB is my friend"

        },
        {
            _id :ObjectId("534124412342377"),
            "message":"MongoDB is my friend too"

        },
        ...
    ]
},
{
    "_id": ObjectId("22341324134224234"),
    messages:[
        {
            _id :ObjectId("8341244123411235"),
            "message":"Something clever"

        },
        {
            _id :ObjectId("134124412342376"),
            "message":"blah blah blah"

        },
        ...
    ]
}

我现在正在做的事情:

var query = {};

query["_id"] = new ObjectID(threadID);

var update = {$push: {}};    //I write the update object externally …

工具:Reactjs 0.14.0 Vanilla Flux

我需要唯一标识符有两个原因:

1. 儿童和解
2. 跟踪点击的孩子

所以,假设我有一个如下所示的消息列表:

[
      {
        id: 1241241234,  <-----The unique id is kept here
        authorName:"Nick"
        text:"Hi!"
      },
      ...
]

现在我使用"Array.prototype.map()" 在所有者组件内创建"ownee"组件(MessageListItem)MessageSection

function getMessageListItem)(message) {

  return (
    <MessageListItem key={message.id} message={message}/>
  );
}

var MessageSection = React.createClass({
   render: function(){
       var messageListItems = this.state.messages.map(getMessageListItem);
       <div>
           {messageListItems }
       </div>
   }
});

但是在MessageListItem中未定义this.props.key,即使我知道在传递它时定义的事实.

var ConvoListItem = React.createClass({
  render: function() {
    console.log(this.props.key); //Undefined
  }
});

我猜有一个原因是React没有让"关键"用作道具.

题:

如果我不能使用密钥作为支柱 - 那么在动态包含状态的子元素列表上处理密钥和设置唯一标识符的二元性需求的正确方法是什么？