今天我开始学习ReactJS,一小时后面临问题..我想插入一个在页面上div内有两行的组件.这是我在下面做的简单例子.
我有一个HTML:
<html>
..
<div id="component-placeholder"></div>
..
</html>
渲染函数如下:
...
render: function() {
return(
<div className="DeadSimpleComponent">
<div className="DeadSimpleComponent__time">10:23:12</div >
<div className="DeadSimpleComponent__date">MONDAY, 2 MARCH 2015</div>
</div>
)
}
....
在下面我调用渲染:
ReactDOM.render(<DeadSimpleComponent/>, document.getElementById('component-placeholder'));
生成的HTML如下所示:
<html>
..
<div id="component-placeholder">
<div class="DeadSimpleComponent">
<div class="DeadSimpleComponent__time">10:23:12</div>
<div class="DeadSimpleComponent__date">MONDAY, 2 MARCH 2015</div>
</div>
</div>
..
</html>
我不是很高兴React强迫我将所有内容包装在div"DeadSimpleComponent"中的问题.没有明确的DOM操作,它的最佳和简单的解决方法是什么？
更新7/28/2017:React的维护者在React 16 Beta 1中添加了这种可能性
从React 16.2开始,你可以这样做:
render() {
return (
<>
<ChildA />
<ChildB />
<ChildC />
</>
);
}
我把我的骨架应用程序用spring mvc推送到openshift git repo.我看到了成功日志,但实际上当我转到我的应用程序网址时,我只看到默认的欢迎页面上有说明..我可以错过什么？
这是我的远程maven日志:
remote: [INFO] ------------------------------------------------------------------------
remote: [INFO] Building WordParty 1.0-SNAPSHOT
remote: [INFO] ------------------------------------------------------------------------
remote: [INFO]
remote: [INFO] --- maven-clean-plugin:2.4.1:clean (default-clean) @ wordparty ---
remote: [INFO]
remote: [INFO] --- maven-resources-plugin:2.5:resources (default-resources) @ wordparty ---
remote: [INFO] Using 'UTF-8' encoding to copy filtered resources.
remote: [INFO] Copying 1 resource
remote: [INFO]
remote: [INFO] --- maven-compiler-plugin:3.1:compile (default-compile) @ wordparty ---
remote: [INFO] Changes detected - recompiling the module!
remote: [INFO] Compiling 11 source files to /var/lib/openshift/549f36af5973caa3de00018f/app-root/runtime/repo/target/classes
remote: [INFO]
remote: [INFO] …我不会确定“ foo”分支的年龄。据我了解，不可能直接获得此信息。我试图编写将在“ foo”分支上找到有关第一次提交的信息的命令。
hg log -r "parents(min(branch(foo)))"
这不完全是我想要的。有人可以帮我吗？
我有一个应用程序，主要是关于学习一门新语言。在我的应用程序中有一个输入字段，它需要用户学习的语言中的文本。因此，如果用户专注于该输入，理想情况下，我希望自动将布局切换到目标语言。使用户体验更愉快（您无需担心布局错误）。
我所知道和尝试过的
第二种方法的问题是，如果您输入足够快，您可能会遇到插入符号位置的问题。它会导致输入中出现错误的字符串。
您是否有任何想法如何实现即使在几乎立即同时按下两个键的情况下以极快的速度键入文本时也能正常工作的行为？
所描述方法的 PS 代码
const codeToEn = {
65: 'a',
// ... and so on
}
const acceptableChars = /^[a-zA-Z0-9 .+_)(%@!?,&$*'"`~]+$/g;
document.getElementById('some-input-id').addEventListener('keyup', function (e) {
if (codeToEn[e.which]
&& !acceptableChars.test(this.value)) {
const char = codeToEn[e.which];
const {selectionStart, selectionEnd} = this;
const currentVal = this.value;
let leftPart = currentVal.substring(0, selectionStart - 1);
let rightPart = currentVal.substring(selectionStart );
this.value = leftPart + char + rightPart;
this.setSelectionRange(selectionStart, selectionEnd);
}
});