许多模板语言都有"slots"或"yield"语句,允许进行某种控制反转,将一个模板包装在另一个模板中.
Angular有"transclude"选项.
Rails有收益率声明.如果React.js有yield语句,它将如下所示:
var Wrapper = React.createClass({
render: function() {
return (
<div className="wrapper">
before
<yield/>
after
</div>
);
}
});
var Main = React.createClass({
render: function() {
return (
<Wrapper><h1>content</h1></Wrapper>
);
}
});
Run Code Online (Sandbox Code Playgroud)
期望的输出:
<div class="wrapper">
before
<h1>content</h1>
after
</div>
Run Code Online (Sandbox Code Playgroud)
唉,React.js没有<yield/>
.如何定义Wrapper组件以实现相同的输出?
如何收听contentEditable
基于更改事件的控件?
var Number = React.createClass({
render: function() {
return <div>
<span contentEditable={true} onChange={this.onChange}>
{this.state.value}
</span>
=
{this.state.value}
</div>;
},
onChange: function(v) {
// Doesn't fire :(
console.log('changed', v);
},
getInitialState: function() {
return {value: '123'}
}
});
React.renderComponent(<Number />, document.body);
Run Code Online (Sandbox Code Playgroud)
iOS 6内置支持远程调试(1分钟截屏视频).它适用于新的Safari Web Inspector,它似乎是一个1年前的WebKit Inspector分支.它错过了一些功能,如JS编辑和WebSocket框架检查.
Safari的Web检查器确实使用WebKit远程调试协议.但是,Safari不使用TCP/HTTP作为传输层,因此使其与Chrome不兼容.
苹果公司的Timothy Hatcher(又名Xenon)表示
safari mobile-safari web-inspector ios google-chrome-devtools
我正在寻找将文件从一个目录合并到另一个目录的shell脚本.
样品:
html/
a/
b.html
index.html
html_new/
a/
b2.html
b.html
Run Code Online (Sandbox Code Playgroud)
用法:
./mergedirs.sh html html_new
Run Code Online (Sandbox Code Playgroud)
结果:
html/
a/
b.html
b2.html
index.html
Run Code Online (Sandbox Code Playgroud)
html/a/b.html
被html_new/a/b.html
html/a/b2.html
复制的被取而代之的是html_new/a/b2.html
html/index.html
被保持不变的
我想将DOM节点甚至整个序列化为window
JSON.
例如:
>> serialize(document)
-> {
"URL": "http://stackoverflow.com/posts/2303713",
"body": {
"aLink": "",
"attributes": [
"getNamedItem": "function getNamedItem() { [native code] }",
...
],
...
"ownerDocument": "#" // recursive link here
},
...
}
Run Code Online (Sandbox Code Playgroud)
JSON.stringify(window) // TypeError: Converting circular structure to JSON
Run Code Online (Sandbox Code Playgroud)
问题是JSON默认不支持循环引用.
var obj = {}
obj.me = obj
JSON.stringify(obj) // TypeError: Converting circular structure to JSON
Run Code Online (Sandbox Code Playgroud)
window
和DOM节点有很多.window === window.window
将如此document.body.ownerDocument === document
.
此外,JSON.stringify
不序列化函数,所以这不是我想要的.
`dojox.json.ref.toJson()` can easily serialize object with …
Run Code Online (Sandbox Code Playgroud) 我有一个ruby gem,它对每个操作系统都有不同的依赖关系.我必须明确地写下所有这些:
在Mac OS X上:
Run Code Online (Sandbox Code Playgroud)gem install livereload
在Linux上:
Run Code Online (Sandbox Code Playgroud)gem install rb-inotify livereload
在Windows上:
Run Code Online (Sandbox Code Playgroud)gem install eventmachine-win32 win32-changenotify win32-event livereload
我可以稍微调整一下gemspec,这样gem install livereload
每个操作系统的安装说明都很简单吗?
React文档没有关于处理非CSS转换的动画的任何内容,例如滚动位置和SVG属性的动画.
至于CSS过渡,有一个附加组件.
这是一个简单的SVG示例示例:
/**
* @jsx React.DOM
*/
function animate(duration, onStep) {
var start = Date.now();
var timer = {id: 0};
(function loop() {
timer.id = requestAnimationFrame(function() {
var diff = Date.now() - start;
var fraction = diff / duration;
onStep(fraction);
if (diff < duration) {
loop();
}
});
})();
return timer;
}
function lerp(low, high, fraction) {
return low + (high - low) * fraction;
}
var App = React.createClass({
getInitialState: function() {
return …
Run Code Online (Sandbox Code Playgroud) 我的状态是:
[
{type: "translateX", x: 10},
{type: "scaleX", x: 1.2}
]
Run Code Online (Sandbox Code Playgroud)
我正在使用双向绑定助手,我无法提供有效的密钥字符串linkState
:
this.state.map(function(item, i) {
return <div><input valueLink={this.linkState( ??? )}></div>
}
Run Code Online (Sandbox Code Playgroud)
如果this.linkState
接受一些查询语法会很好,例如从我的示例中"0.type"
检索 "translateX"
.
有没有解决方法?
我编写了DeepLinkState mixin,它是React.addons.LinkedStateMixin的直接替代品.用法示例:
this.state.map(function(item, i) {
return <div><input valueLink={this.linkState([i, "x"])}></div>
}
Run Code Online (Sandbox Code Playgroud)
linkState("0.x")
也是可以接受的语法.
是否可以在Internet Explorer中模拟事件捕获?
一个例子:
<a>one</a> <a>two</a> <a>three3</a> <script> var links = document.getElementsByTagName("A"); for (var i=0; i < links.length; i++) { links[i].onclick = function(){ alert("clicked"); }; } </script>
我想阻止所有这些点击事件被触发.我可以用一个事件观察者做到这一点:
document.addEventListener("click", function(e) { e.stopPropagation(); e.preventDefault(); }, true);
我怎么能在IE中做同样的事情?IE <9不支持addEventListener
.它确实支持attachEvent
,但它没有useCapture
选项.
我找到了setCapture方法,但它看起来与W3捕获模型无关.
events internet-explorer dom event-handling javascript-events
我有很多HTML文件.我想替换一些元素,保持所有其他内容不变.例如,我想执行这个jQuery表达式(或者它的一些等价物):
$('.header .title').text('my new content')
Run Code Online (Sandbox Code Playgroud)
在以下HTML文档中:
<div class=header><span class=title>Foo</span></div>
<p>1<p>2
<table><tr><td>1</td></tr></table>
Run Code Online (Sandbox Code Playgroud)
并得到以下结果:
<div class=header><span class=title>my new content</span></div>
<p>1<p>2
<table><tr><td>1</td></tr></table>
Run Code Online (Sandbox Code Playgroud)
问题是,我尝试过的所有解析器(Nokogiri,BeautifulSoup,html5lib)都将它序列化为类似这样的东西:
<html>
<head></head>
<body>
<div class=header><span class=title>my new content</span></div>
<p>1</p><p>2</p>
<table><tbody><tr><td>1</td></tr></tbody></table>
</body>
</html>
Run Code Online (Sandbox Code Playgroud)
他们补充说:
是否有满足我需求的解析器?它应该在Node.js,Ruby或Python中工作.
javascript ×5
reactjs ×4
dom ×3
ruby ×2
animation ×1
bash ×1
command-line ×1
composition ×1
css ×1
data-binding ×1
events ×1
html ×1
html-parsing ×1
ios ×1
json ×1
node.js ×1
python ×1
rubygems ×1
safari ×1
scripting ×1
sh ×1
shell ×1
svg ×1
transclusion ×1