我试图实现一个简单的功能,onPress
的一个按钮,它应该添加place eName
放置数组并显示在视图中,但我似乎得到了一个错误,请帮助
这是我的代码,
export default class App extends Component{
state = {
placeName: "",
places: []
}
onChangeName = (val) => {
this.setState({
placeName: val
})
}
placeSubmitHandler = () => {
if(this.state.placeName === "") {
alert('enter something');
} else {
this.setState(prevState => {
return {
places: prevState.places.concat(prevState.placeName)
}
})
}
}
render() {
const placesOutput = this.state.places.map((place, i) => (
<Text key={i}>{place}</Text>
));
return (
<View style={styles.container}>
<View style={styles.inputContainer}>
<TextInput
style={{width: 300}}
value={this.state.textInput}
placeholder='enter anything'
onChange={this.onChangeName}
style={styles.placeInput}
/>
<Button title='Add' style={styles.placeButton} onPress={this.placeSubmitHandler}/>
</View>
<View>
{placesOutput}
</View>
</View>
);
}
}
这是我得到的错误,
Invariant Violation: Objects are not valid as a React child (found: object with keys {dispatchConfig, _targetInst, _dispatchListeners, _dispatchInstances, type, target, currentTarget, eventPhase, bubbles, cancelable, timeStamp, defaultPrevented, isTrusted, nativeEvent, isDefaultPrevented, isPropagationStopped}). If you meant to render a collection of children, use an array instead.
in RCTText (at Text.js:154)
in TouchableText (at Text.js:278)
in Text (at App.js:48)
in RCTView (at View.js:45)
in View (at App.js:62)
in RCTView (at View.js:45)
in View (at App.js:51)
in App (at renderApplication.js:35)
in RCTView (at View.js:45)
in View (at AppContainer.js:98)
in RCTView (at View.js:45)
in View (at AppContainer.js:115)
in AppContainer (at renderApplication.js:34)
我是个新来的土生土长的人,所以我对此一无所知。
你的place输出变量返回一个jsx形式的对象。
而不是
const placesOutput = this.state.places.map((place, i) => (
<Text key={i}>{place}</Text>
));
试试看
const placesOutput = this.state.places.map((place, i) => (
<Text key={i}>{place.name} /* place is an object use any property of it. */</Text>
));
在您的
<TextInput
style={styles.placeInput}
value={this.state.textInput}
placeholder="enter anything"
onChangeText={this.onChangeName}
/>
还要注意,您正在复制它的
style
属性。统一它们或将它们作为数组传递
style={[styles.placeInput, {width: 300}]}
在组件的呈现函数中,我有: 所有内容都显示良好,但单击 元素时,我会收到以下错误: 未捕获得错误:不变冲突:对象作为React子级无效(找到:具有键得对象{dispatchConfig,dispatchMarker,nativeEvent,target,currentTarget,type,eventPhase,bubbles,cancelable,timeStamp,defaultPrevent
我有以下代码: 但我得到了以下错误: 未捕获的不变违规:对象作为React子对象无效(找到:带有键{正文、附件、视频、主题、updated_at、id、主题、反对票、作者、posted_at、注释、user_vote、好评、状态、标签、位置、track_impact、user_is_following、comments_count}的对象)。如果要呈现子集,请使用数组来代替,或者使用React加载
我正在React中制作一个RecipeBox应用程序,在我尝试实现搜索功能之前,它运行良好。一旦用户在搜索栏中输入搜索项,就会抛出错误。此方法中的块抛出错误- 这是错误消息- 控制台显示- 这表明是一个包含对象的数组。但是会抛出错误- 有趣的是,如果我删除搜索栏功能并完全删除else块,相同的语句就可以正常工作,不会抛出任何错误- 这是我在Codepen上的应用程序。 复制步骤- 在搜索栏中搜索现
问题内容: 请帮我。我不知道为什么这段代码不起作用。 它给我一个错误:“对象作为React子对象无效(找到:带有键{itemss}的对象)。如果要渲染子对象的集合,请改用数组。” 为什么{i.title}是对象。这只是一个字符串。我怎样才能解决这个问题?以及实际上如何迭代嵌套对象? 问题答案: 问题是因为你回来了 这是的等效即 您将返回具有键和的对象。你可以写 要么 要么 PS请注意,前两种方法将
问题内容: 我正在尝试使用用户代理将json设置为一种状态,但出现错误: 未捕获的不变违规:对象作为React子对象无效(找到:具有键{…}的对象)。如果您打算渲染孩子的集合,请使用数组代替,或者使用React附加组件中的createFragment(object)包装对象。 设置状态的方法: 服务 杰森 问题答案: 您无法执行此操作:由于您的错误提示您尝试执行的操作无效。您正在尝试将整个数组呈现
问题内容: 我正在尝试通过数组映射来呈现帖子列表。我已经做过很多次了,但有一些 我得到的是: 未捕获的错误:对象作为React子对象无效(找到:[object Promise])。如果要渲染子级集合,请改用数组。 我检查了renderPosts返回的数据,它是一个具有正确值且没有承诺的数组。这里发生了什么? 问题答案: 将返回非实际数据,并且AFAIK Reactjs将不会在中隐式解析Promis