我认为我在概念上缺少使用React.js进行服务器端渲染的东西
假设我想创建一个页面来显示来自服务器端数据库的项目,并使用输入字段来过滤它们.
我想要一个页面:
/items?name=foobar假设我有一个公共REST API来查询客户端的项目.
从概念上讲,我在第一次请求(GET /items?name=foobar)时想要做的是:
initialName)所以我尝试了这个:
// A stateful component, maintaining the value of a query field
var ItemForm = React.createClass({
getInitialState : function () {
return {
name : this.props.initialName
};
},
handleInputValueChanged : function() {
var enteredName = this.refs.query.getDOMNode().value.trim();
this.props.onNameChanged(enteredName);
},
render : function () {
return React.DOM.form({
children : [
React.DOM.label({
children : "System name"
}),
React.DOM.input({
ref : "query",
value : this.state.name,
onChange : this.handleInputValueChanged …Run Code Online (Sandbox Code Playgroud) 由于React没有任何内置的管理方法document.title,我曾经在componentDidMount路由处理程序中设置它.
但是现在我需要根据state异步提取修改标题.我开始投入分配componentDidUpdate,但我时不时地忘记将document.title作业放到某些页面中,之前的标题一直存在,直到我终于注意到它为止.
理想情况下,我想要一种以document.title声明方式表达的方式,而不必分配它.鉴于我希望能够在几个嵌套级别指定文档标题,某种"假"组件可能是最方便的:
其他要求:
<noscript>);我能用什么?
我在内存管理语言上花了一些时间后回到C++,而且我突然想知道实现依赖注入的最佳方法是什么.(我完全卖给DI,因为我发现它是使测试驱动设计变得非常简单的最简单方法).
现在,浏览SO和谷歌在这件事上得到了很多意见,我有点困惑.
作为这个问题的答案,C++中的依赖注入,有人建议你不要传递原始指针,即使是依赖注入.据我所知,这与对象的所有权有关.
现在,在臭名昭着的谷歌风格指南中,也解决了对象的所有权问题(虽然没有详细说明我的州;)):http://google-styleguide.googlecode.com/svn/trunk/cppguide.xml#Smart_Pointers
所以我理解的是,为了使哪个对象拥有其他对象的所有权更清楚,你应该避免传递原始指针.特别是,它似乎反对这种编码:
class Addict {
// Something I depend on (hence, the Addict name. sorry.)
Dependency * dependency_;
public:
Addict(Dependency * dependency) : dependency_(dependency) {
}
~Addict() {
// Do NOT release dependency_, since it was injected and you don't own it !
}
void some_method() {
dependency_->do_something();
}
// ... whatever ...
};
Run Code Online (Sandbox Code Playgroud)
如果Dependency是一个纯虚拟类(又名穷人 - 接口),那么这个代码可以很容易地注入依赖的模拟版本(使用像google mock这样的东西).
问题是,我真的没有看到这种代码可以解决的问题,以及为什么我应该使用除了原始指针以外的任何东西!是不是很清楚依赖来自哪里?
另外,我读了很多帖子,暗示在这种情况下应该使用引用,这样的代码更好吗?
class Addict {
// Something I depend on (hence, the Addict name. …Run Code Online (Sandbox Code Playgroud) 假设我有一个像这样结构的.proto:
syntax = "proto3";
message Foo {
...
}
message Bar {
...
}
message Msg {
string baz = 1;
oneof some_union {
Foo foo = 2;
Bar bar = 3;
}
}
Run Code Online (Sandbox Code Playgroud)
序列化此类消息的预期方式是什么?规范的JSON Mapping部分不是很清楚.
我可以看到至少两种表示方式,哪种方式正确?
第一种方式:在"顶层"有一个元素,忽略其他元素:
{
"baz" : 0,
"foo" : { ... }
}
Run Code Online (Sandbox Code Playgroud)
第二种方式:拥有一个带有联合名称的"unmbrella"属性,并给它一个字段.
{
"baz" : 0,
"some_union": {
"foo" : { .... }
}
}
Run Code Online (Sandbox Code Playgroud)
我应该期待什么?
地球人.
我,身心相对理智,特此放弃了自己对CSS定位的理解.
关于CSS的在线资源很长,以解释"颜色"属性可以让你设置东西的"颜色".Unmöglish.
然后,如果你想要把东西给别的左侧(疯狂的想法,对吧?),所有你需要做的是将其设置为浮动到只要你设置了"相对"标志其父块左边这必须有一个祖父节点,其"绝对"标志设置为true,以便它相对于另一个可能包含或不包含任何内容,具有位置,大小或不具有的容器定位,具体取决于浏览器,其他东西的大小,可能还有月亮的阶段.(建议CSS专家不要认真对待上一段.我很确定有人会指出我的咆哮是无效的,或符合w3c标准 - 并且它只适用于IE6的瑞典测试版)
开玩笑,我正在寻找任何资源来解释CSS中布局背后所有疯狂的根本原因.从本质上讲,对于CSS来说,Crockford的文章对于Javascript来说是什么.
本着这种精神,让我指出,我不是在寻找像蓝图这样的CSS库或网格框架,也不是像小写这样的CSS扩展语言.我一直在使用它们来减轻我的痛苦,但我担心当他们说他们无法将自己的思想包裹在JS中的原型继承中时,就像告诉别人"只使用jQuery".
如果所有你能指出的是http://shop.oreilly.com/product/9781565926226.do,我想我会认为自己注定失败.
提前致谢.
编辑:我可能不应该谈论"定位"(感谢所有谁再次解释'位置:相对'并不意味着'相对于你的容器'和'位置:绝对'意味着相对于某些东西.我'从来没有如此接近用SO问题制作monty python脚本).我认为我的意思是一般的布局(定位+浮动+基线+所有将东西放在直线上所需的废话).
也请原谅咆哮的语调,我正试图将一些幽默倾注到沮丧中.如果可以的话,我会用禅技术冷静下来,但这只会让我想起 这个.
我试图在生成的标记中抽象出一个常见的场景,我需要一些标记来"包装"任意内容.所以不要写这个
<div class="container">
<p class="someClass">Some header</p>
<div id="foo">
<!-- The real content that changes -->
</div>
</div>
Run Code Online (Sandbox Code Playgroud)
我可以写一些"喜欢"的东西
#????
<!-- The real content that changes
#end
Run Code Online (Sandbox Code Playgroud)
哪里显然我不知道#???? 将会.
据我所知,不可能用宏做这个,不能为块的开始定义一个宏,而为块的结尾定义一个宏.
#macro(startContained)
<div class="container">
<p class="someClass">Some header</p>
<div id="foo">
#end
#macro(endContained)
</div>
</div>
#end
#startContained
<!-- The real content -->
#endContained
Run Code Online (Sandbox Code Playgroud)
有更好的方法吗?
CSS最大的麻烦之一就是如何恰当地定位东西是多么棘手.
现在我要努力去理解事情,我总是需要几次尝试才能猜出哪些必须浮动哪个方向与什么相关.
现在,我的麻烦是,我通常在某些时候有这样的代码:
<div class="someContainerThatWillWorkAsALine">
<div class="someOtherContainerThatWillWorkAsAcolumn">
<div class="StuffInAcolumn">
...
</div>
Run Code Online (Sandbox Code Playgroud)
这样的课程的唯一目的是:
我有时会想知道我是在编写软件,还是试图找到合适的方法将天线转为接收旧式模拟电视.
"好吧,在右边再多一点,拜托......不,还没到那里.现在完美,别动!"
此外,这些类都没有真正的语义,所以这是非常辛苦,给他们一个有意义的名字.这使得CSS非常难以阅读,更糟糕的是,写起来非常困难,因为每次我必须选择一个名称"而另一类 - 那简单地告诉一个块"时,我会发生惊恐发作-act作为一种线".因为每个类名都是web2.0-y-one-page-site的全局,所以您不希望与使用过的名称冲突.
那么你如何解决这类问题呢?你呢 :
欢迎任何想法.
在反应中你可以做类似的事情:
var Wrap = React.createClass({
render: function() {
return <div>{ this.props.children }</div>;
}
});
var App = React.createClass({
render: function() {
return <Wrap><h1>Hello word</h1></Wrap>;
}
});
Run Code Online (Sandbox Code Playgroud)
这允许您将组件传递给另一个组件.但是,如果Wrap有另一个你可以把内容放入的div.请考虑以下事项:
var Wrap = React.createClass({
render: function() {
return (
<div>
<ul className="icons">
// Another compoent should be passed here from App to render icons.
</ul>
{ this.props.children }
</div>
);
}
});
var App = React.createClass({
render: function() {
return <Wrap><h1>Hello word</h1></Wrap>;
}
});
Run Code Online (Sandbox Code Playgroud)
在上面的示例中,您可以看到我不仅要传递App组件的子项,还要传递另一个组件的图标ul.这可能吗?
如果是这样,怎么样?
我正在将项目从autotools迁移到cmake.我有关于gettext支持的问题.
现有的FindGettext.cmake模块提供了一个很好的功能:
GETTEXT_CREATE_TRANSLATIONS(foo.pot ALL fr.po de.po)
Run Code Online (Sandbox Code Playgroud)
你在哪里提供一个锅文件和翻译po fil; 该函数负责将po文件转换为gmo文件,并添加正确的安装目标以确保可以在运行时找到文件.一切都很好.
现在问题是:在添加新消息时,如何更新您的pot文件和po文件?
为此,autotools将生成一个"update-po"目标,(根据我的理解),使用包含翻译字符串的所有文件的列表读取POTFILES.in,将其与其他信息混合,最后调用xgetext生成宝.我认为相应的Makefile任务是包含以下内容的任务:
case `$(XGETTEXT) --version | sed 1q | sed -e 's,^[^0-9]*,,'` in \
'' | 0.[0-9] | 0.[0-9].* | 0.1[0-5] | 0.1[0-5].* | 0.16 | 0.16.[0-1]*) \
$(XGETTEXT) --default-domain=$(DOMAIN) --directory=$(top_srcdir) \
--add-comments=TRANSLATORS: $(XGETTEXT_OPTIONS) \
--files-from=$(srcdir)/POTFILES.in \
--copyright-holder='$(COPYRIGHT_HOLDER)' \
--msgid-bugs-address="$$msgid_bugs_address" \
;; \
*) \
$(XGETTEXT) --default-domain=$(DOMAIN) --directory=$(top_srcdir) \
--add-comments=TRANSLATORS: $(XGETTEXT_OPTIONS) \
--files-from=$(srcdir)/POTFILES.in \
--copyright-holder='$(COPYRIGHT_HOLDER)' \
--package-name="$${package_gnu}ube" \
--package-version='0.4.0-dev' \
--msgid-bugs-address="$$msgid_bugs_address" \
;; \
esac
Run Code Online (Sandbox Code Playgroud)
所以,在我重新发明轮子之前,是否有一个现有的cmake函数来做同样的事情?或者我是否必须找到xgettext可执行文件,列出文件,并手动执行此操作?makefile版本似乎相当复杂(虽然它似乎处理了很多情况); 我不介意不具有写cmake的同等学历;)
谢谢
PH
关于CSS网格的所有指南似乎都暗示了一种结构,其中位于网格中的元素是网格本身的子元素.
<div class="wrapper">
<div>A</div>
<div>B</div>
</div>
Run Code Online (Sandbox Code Playgroud)
凡.wrapper具有display: grid和网格属性的定义.
如果我想在网格本身上放置一个网格的"孙子"元素(而不是依赖于它的父级?),这是否有意义?
<div class="wrapper">
<div>A</div>
<div>
<div>B</div>
<div>C</div>
</div>
</div>
Run Code Online (Sandbox Code Playgroud)
在这里,我希望能够将A,B和C各自放在他们自己的网格行上; 这甚至有意义吗?