我最欣赏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) 我目前正在Firefox中调试我的网站的下一层,并在我的JavaScript中发现了一个非常奇怪的错误.在Firefox中,是否需要在引用这些函数的任何代码行之上定义函数?这对我来说真的很奇怪.
var myClass = new MyClass(myCallback);
function myCallback() {
// code
}
Run Code Online (Sandbox Code Playgroud)
它抛出了以下错误: Error: myCallback is not defined
var myCallback = function() {
// code
}
var myClass = new MyClass(myCallback);
Run Code Online (Sandbox Code Playgroud)
所以我的问题是:这是正常行为还是其他事情发生了?我的意思是,在将来编码时我是否需要考虑这一点?
查看React.js中的Virtual DOM并进行一些性能测试,我对这个库非常感兴趣.它似乎是Backbone令人敬畏的模型,路由器和集合结构的完美附件.
但是,由于缺乏高质量的教程和课程,我留下了一些问题,希望有人能够回答:
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时最好的做法. …
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.
var MyMixin = {
componentDidMount: function() {
// Do something when component is mounted
console.log("Mixin fn ran");
}
};
var …
Run Code Online (Sandbox Code Playgroud) 在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?
我已经尝试过 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 ×6
backbone.js ×3
reactjs ×3
composition ×1
debugging ×1
dom ×1
firefox ×1
inheritance ×1
mvvm ×1
operators ×1
performance ×1
view ×1