reactjs - react : Unexpected token return

Question

我是 React 新手，我有以下代码:

render() {
        return (
            <div>
                <form>
                    <input type="text" name="texte" value={this.state.value} onChange={this.handleChange} />
                    <input type="submit" value="Valider" onClick={this.update} />
                </form>
                var list = this.state.liste.map(function(elt) {
                    return <li>{elt}</li>
                });
                <ul>{list}</ul>
            </div>
        );
    }

我有一个语法错误:

Unexpected token return <li>{elt}</li>
                 ^

我不明白为什么...感谢您的帮助!

Answer 1

像这样重构你的代码:

render() {

var list = this.state.liste.map(function(elt) {
                    return <li>{elt}</li>
                });
        return (
            <div>
                <form>
                    <input type="text" name="texte" value={this.state.value} onChange={this.handleChange} />
                    <input type="submit" value="Valider" onClick={this.update} />
                </form>

                <ul>{list}</ul>
            </div>
        );
    }

或

render() {
        return (
            <div>
                <form>
                    <input type="text" name="texte" value={this.state.value} onChange={this.handleChange} />
                    <input type="submit" value="Valider" onClick={this.update} />
                </form>
                <ul>{this.state.liste.map(function(elt) {
                    return <li>{elt}</li>
                });}</ul>
            </div>
        );
    }

如果没有 {}，则无法在 JSX 语法中添加代码