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语法中添加代码

React：意外的令牌返回

1 个答案: