我是react-native的新手,而Im试图为我的react native分配创建一个按钮,但我不断收到意想不到的标记,语法错误。这是下面的代码(他们说错误在6-11行中)
我正在使用https://snack.expo.io/测试我的代码
这里是关于以下错误的确切说法:
''' /module:/App.js:意外令牌(8:18)
6- const Todo =道具=>(
7-视图>
8-title =“删除” />
9-{props.todo.text}
10-/查看>
11-)
评估模块://App.js.js
正在加载模块://App.js'''
由于某种原因,堆栈上的溢出未显示(视图,按钮,文本,ScrollView),但是它们在那里,但是您可以根据需要将它们重新添加以使代码正常工作。
我看过代码,但似乎无法找回我想要的东西,我将在此下面添加整个代码,以便您可以看到正在使用的所有代码。
感谢您的帮助!
import React from 'react';
import {View, Button, Text, ScrollView} from 'react-native'
let id = 0
const Todo = props => (
<View>
<Button><onPress={props.onDelete}> title="delete" />
<Text>{props.todo.text}</Text>
</View>
)
export default class App extends React.Component {
constructor(){
super()
this.state = {
todos: [],
}
}
}
addTodo() {
id++
const text = 'TODO number ${id}'
this.setState({
todos: [
...this.state.todos,
{id: id, text: text, checked: false},
],
})
}
removeTodo(id) {
this.setState({
todo: this.state.todo.filter(todo => todo.id !
)
})
}
toggleTodo(id) {
this.setState({
todos: this.site.todo.map(todo => {
if (todo.id !== id) return todo
return {
id: todo.id
text: todo.text
checked: !todo.checked
}
})
})
}
render() {
return(
<View>
<Text>Todo count: this.state.todo.length}
</Text>
<Text>Unchecked todo count: this.state.todos.filter(todo => !todo.checked).length} </Text>
<Button onPress={() => this.addToDo()} title ="Add TODO" />
<ScrollView>
{this.state.todo.map(todo => (
<Todo
onToggle={() => this.toggleTodo(todo.id)}
onDelete={() => this.removeTodo(todo.id)}
todo={todo}
/>
))}
</ScrollView>
</View>
)
}
}
您应该先导入它
import { StyleSheet, Text, View, Button } from 'react-native';
或
import Button from 'react-native';
请按以下方式更改Todo功能
const Todo = props => (
<View>
<Button onPress={props.onDelete} title="delete" />
<Text>{props.todo.text}</Text>
</View>
)
但是即使这样,您的代码也无法编译。您的代码中有很多编译问题。请检查并重试。