小编Ahr*_*got的帖子

扩展React.js组件

我最欣赏Backbone.js的一件事是简单优雅的继承是如何工作的.我开始接触React了,并且无法找到类似于Backbone代码的任何反应

var Vehicle = Backbone.View.extend({
    methodA: function() { // ... }
    methodB: function() { // ... }
    methodC: function() { // ... }
});

var Airplane = Vehicle.extend({
    methodC: function() {
        // Overwrite methodC from super
    }
});
Run Code Online (Sandbox Code Playgroud)

在反应中我们有mixins,并且使用那些我们可以得到一些接近上面的例子,如果我们这样做

var vehicleMethods = {
    methodA: function() { // ... }
    methodB: function() { // ... }
}

var Vehicle = React.createClass({
    mixins: [vehicleMethods]
    methodC: function() { 
        // Define method C for vehicle
    }
});

var Airplane = React.createClass({
    mixins: …
Run Code Online (Sandbox Code Playgroud)

javascript inheritance backbone.js reactjs

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

Firefox中没有定义JavaScript函数?

我目前正在Firefox中调试我的网站的下一层,并在我的JavaScript中发现了一个非常奇怪的错误.在Firefox中,是否需要在引用这些函数的任何代码行之上定义函数?这对我来说真的很奇怪.

这是导致错误的简化版本:

var myClass = new MyClass(myCallback);

function myCallback() {
    // code
}
Run Code Online (Sandbox Code Playgroud)

它抛出了以下错误: Error: myCallback is not defined

这就是我需要做的才能在Firefox中工作:

var myCallback = function() {
    // code
}

var myClass = new MyClass(myCallback);
Run Code Online (Sandbox Code Playgroud)

所以我的问题是:这是正常行为还是其他事情发生了?我的意思是,在将来编码时我是否需要考虑这一点?

javascript debugging error-handling firefox

13
推荐指数
1
解决办法
6363
查看次数

使用React.js时的一般结构

查看React.js的Virtual DOM并进行一些性能测试,我对这个库非常感兴趣.它似乎是Backbone令人敬畏的模型,路由器和集合结构的完美附件.

但是,由于缺乏高质量的教程和课程,我留下了一些问题,希望有人能够回答:

HTML模板

React是否完全废除了HTML模板的概念?我在谈论将视图标记放在单独的HTML文件中(或者在<script type=text/template>标记的同一页面上).你知道,就像你使用underscore.js Handlebars等...

入门套件的例子似乎都拥有JSX或React.DOM右视图类中的功能,这似乎有点乱给我,我可以看到这个开始有点失控,因为你的观点越来越复杂.

这是一个使用带有嵌套表的基本Twitter Bootstrap面板元素呈现2个值及其总和的示例.

var CustomView = React.createClass({
    render: function() {
        var x = this.props.x;
        var y = this.props.y;

        return (
            <div className="panel panel-primary">
                <div className="panel-heading">
                    <h1 className="panel-title">Should I put all this markup somewhere else?</h1>
                </div>
                <div className="panel-body">
                    <table className="table">
                        <thead>
                            <tr>
                                <th>X</th>
                                <th>Y</th>
                                <th>Combined val</th>
                            </tr>
                        </thead>
                        <tbody>
                            <tr>
                                <td>{x}</td>
                                <td>{y}</td>
                                <td>{x + y}</td>
                            </tr>
                        </tbody>
                    </table>
                </div>
            </div>
        );
    }
});
Run Code Online (Sandbox Code Playgroud)

我不想知道是否可以将这些东西移到一个单独的文件中,而是,我试图理解在使用React时最好的做法. …

javascript view mvvm backbone.js reactjs

11
推荐指数
2
解决办法
6289
查看次数

Mixins and duplicate methods in React.js

Getting more and more into the awesomeness that is React.js and I've started to use Mixins more.

One thing I noticed, is that both my mixin and my component can have a componentDidMount method — And both functions will be called, so defining it in the component won't override the one in the mixin and vice versa.

Here's an example:

var MyMixin = {
    componentDidMount: function() {
        // Do something when component is mounted
        console.log("Mixin fn ran");
    }   
};

var …
Run Code Online (Sandbox Code Playgroud)

javascript composition reactjs

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

JavaScript中&&运算符的性能

在JavaScript中,AND/OR运算符如何实际处理?我想知道哪些是更高效的,或者他们是否在内部做同样的事情:

例A

if ( conditionA && conditionB ) {
    // Do something
}
Run Code Online (Sandbox Code Playgroud)

例B

if ( conditionA ) {
    if ( conditionB ) {
        // Do something
    }
}
Run Code Online (Sandbox Code Playgroud)

实施例A只评价conditionB如果conditionA是truthy,或将它总是被评估,因此需要更长的时间来执行(在conditionA IS truthy的情况)比实施例B

javascript performance operators

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

访问backbone.js中视图的元素

我已经尝试过 Backbone.js,到目前为止,这确实是一种享受。非常简单,却又极其强大。很棒的图书馆!

但我遇到了一个问题:我似乎无法访问el我的视图的链接元素(属性)。

我下面的例子会发出警报undefined。看看这个小提琴,看看它的实际效果。

$(function() {
    // Init when DOM is Ready
    App.init();
});

var App = {
    init: function() {
        new App.MyView();
    }
}

App.MyView = Backbone.View.extend({
    el: '#some-id',
    initialize: function() {
        App.MyController.doSomething();
    }
});

App.MyController = {
    doSomething: function() {
        alert('MyView.el: ' + App.MyView.el); // Outputs 'MyView.el: undefined'
    }
}
Run Code Online (Sandbox Code Playgroud)

javascript model-view-controller dom backbone.js

0
推荐指数
1
解决办法
3819
查看次数