- android - RelativeLayout 背景可绘制重叠内容
- android - 如何链接 cpufeatures lib 以获取 native android 库?
- java - OnItemClickListener 不起作用,但 OnLongItemClickListener 在自定义 ListView 中起作用
- java - Android 文件转字符串
我有一个 React 表单,它有一个用于呈现下拉列表的组件,因为选项来自 API。但是,我无法访问嵌入式组件的引用。我正在整理我的第一份表格,并试图了解解决此问题的最佳方法。
var ActivityForm = React.createClass({
handleSubmit: function(e) {
e.preventDefault();
var noteCategoryId = this.refs.note_category_id.getDOMNode().value.trim();
var content = this.refs.content.getDOMNode().value.trim();
if (!category || !content) {
return;
}
// this.props.onCommentSubmit({author: author, text: text});
this.refs.note_category_id.getDOMNode().value = '';
this.refs.content.getDOMNode().value = '';
return;
},
render: function() {
return (
<div className="new-activity">
<h3>New Activity</h3>
<form onSubmit={this.handleSubmit}>
<textarea ref='content' />
<br />
<label>Category</label>
<ActivityFormCategoryDropdown /> # THE REF IN THIS COMPONENT ISN'T ACCESSIBLE
<br />
<input type="submit" value="Add Activity" />
</form>
</div>
);
}
});
最佳答案
最好将 ref
视为 callback attribute并且不再依赖于 refs
对象。如果您确实使用了 refs
对象,请避免访问后代组件的 refs
。您应该将 refs
视为私有(private)访问器,而不是组件 API 的一部分。仅将组件实例上公开的方法视为其公共(public) API。
对于这种情况,我建议从提交事件中获取表单并根据需要遍历其子表单元素。添加 name
属性,因为这是在标准表单提交中识别表单元素的方式,然后您根本不需要 refs
:
var ActivityForm = React.createClass({
handleSubmit: function(e) {
e.preventDefault();
var form = e.target;
// Use the standard [`HTMLFormElement.elements`][1] collection
//
// [1]: https://developer.mozilla.org/en-US/docs/Web/API/HTMLFormElement/elements
var content = form.elements['content'].value;
// do more things with other named form elements
},
render: function() {
return (
<div className="new-activity">
<h3>New Activity</h3>
<form onSubmit={this.handleSubmit}>
<textarea name='content' />
<br />
<label>Category</label>
<ActivityFormCategoryDropdown />
<br />
<input type="submit" value="Add Activity" />
</form>
</div>
);
}
});
2016 年 9 月 21 日更新:根据 ref
String Attribute 中的指导修改建议以避免 refs
对象一起出现文档。
关于javascript - 用组件 react refs,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/25941585/
我想读取帖子的数据并获取用户 key ,然后通过它进行搜索并同时获取用户数据,我尝试过,但它后退了一步,直到它才显示用户名我执行任何其他操作 这是帖子和经过身份验证的用户的 Firebase 实时数据
您知道是否有办法将 js ref 和 css ref 作为单个 ref 包含在 html 中?通常这些 ref 单独包含在 html head 中,但我的经理想知道下游消费者是否有一种简化的方法将这些
我正在使用 Swing+Clojure 开发一个 GUI 应用程序,它需要各种可变数据(例如滚动位置、用户数据、文件名、选定的工具选项等)。 我至少可以看到三种不同的处理这组数据的方式: 创建对所有数
我正在尝试通过 React 使用 ref 属性。我的浏览器出现奇怪的错误,但我无法弄清楚问题出在哪里。谁能向我解释一下为什么我会收到此错误: Error: Invariant Violation: a
在我的程序中,我有模板类,这些模板类主要是用于特殊目的 std::function 的包装器。最小的例子是: template class Foo { public: exp
如果被引用为参数的对象在函数中被修改,是否使用 ref 有关系吗?下面两个函数有区别吗? void DisposeObject(ClassThing c) { c.Dispose(); } vo
尝试将大型但线性的 svn 存储库迁移到 git。 svn 存储库没有标准布局(主干、分支、标签)...只有主干的一个目录。 Ubuntu 12.4 LTS,git 1.7.9.5。 $ git sv
您现在如何设置动态引用? 我收到一个错误 cannot set property of 'test' undefined ,如果我使用 this.someRef['test'] = ref;}/>
试图理解 gerrit 中的 refs/for/refs/* 功能。这个问题与 refs/for/master 无关。 我们什么时候可以使用这个 refs/for/refs/* 功能。 有人可以为此解
我以不同的方式调用 4 种方法时得到不同的结果: static void Main(string[] args) { var emp = new Employee { Name = "ABC"
假设我有以下内容: var t = typeof(Foo).MakeByRefType(); 有没有办法将结果转换回typeof(Foo)? 老实说,我发现的唯一方法是: var t = typeof
我以下列方式使用 ref。那么当在第 5 种方法中创建一个新对象时,是否会一直访问 main 方法中的原始 emp 并在那里创建一个新对象? 如果是,有没有一种方法可以实现相同的功能而无需多次迭代,即
我在文档的 html 标签内有一些文本。文字看起来像这样 I need this text <ref> Some unwanted text </ref> I need thi
一些背景: 前几天我遇到了一些事情,这让我开始思考嵌套函数调用中的重载解析。考虑以下代码: #include void printer(const int &a) { std::cout <<
如果直接从 this.refs 获取元素对象,那么为什么要使用 ReactDOM.findDOMNode? var HelloMessage = React.createClass({ click:f
我在这里做错了什么,或者从 C# 7.2 开始,不支持通过 ref 返回并允许设置的索引器? 作品: public ref byte this[int index] { get { r
看来我现在几乎每天都在这里问问题。我不确定这是好事还是坏事... 今天的“WTF flavor ”涉及我在使用来自 NI Measurement Studio 对象的函数时完全和完全无能为力。与我之前
这个问题在这里已经有了答案: Does foreach() iterate by reference? (10 个答案) Alternative to using ref in foreach? (
给定一个函数声明 dynamic DoSomething(dynamic inputObject) 我可以用枚举调用它作为inputObject: MyEnum myEnum; myEnum = Do
如果我将数组传递给函数并在函数内对数组进行更改,则函数外部存在的数组会反射(reflect)这些效果。例如: var myArr = [1, 2, 3]; function popAll(arr) {
我是一名优秀的程序员,十分优秀!