2016-11-17 2 views
2

Я хочу получить обновленные значения массива. Когда я делаю console.log, я получаю только длину массива, и новые значения не отображаются в представлении. Что здесь не так? js fiddleКак получить значения массива в реакции js

реагируют JS

getInitialState: function() { 
    return { 
    owner: "Martin Schwatz", 
    friends: ["Pietro", "Mike", "Shawn", "Bilbo"], 
    } 
}, 
updateFriends: function(friend) { 
    var a = this.state.friends.push(friend); 
    console.log(a); 
    this.setState({ 
    friends: a, 
    }); 
}, 
+0

@DavinTryon, но как бы РЕАКТ разработчик получить новые значения в массив? – vuvu

+0

'push' возвращает длину массива. –

ответ

1

Посмотрите на этот один

var Hello = React.createClass({ 
    getInitialState: function() { 
    return { 
     owner: "Martin Schwatz", 
     friends: ["Pietro", "Mike", "Shawn", "Bilbo"], 
    } 
    }, 
    updateFriends: function(friend) { 
    var newFriends = this.state.friends.concat(friend) 
    this.setState({ 
     friends: newFriends, 
    }); 
    }, 
    click: function(){ 
    this.updateFriends('VuVu') 
    }, 
    render: function(){ 
    var listOfFriends = this.state.friends.map(function(item,i){ 
     return <li key={i}>{item}</li> 
    }.bind(this)) 
    return <div> 
     <button onClick={this.click}>Add VuVu</button> 
     <hr/> 
     {listOfFriends} 
    </div> 
    } 
}); 

ReactDOM.render(
    <Hello />, 
    document.getElementById('container') 
); 

Он должен работать для вас < fiddle>

+0

благодарим вас за то, что вы прошли и улучшили его! – vuvu

1

push возвращает новую длину массива мутантным. Итак, в текущем коде a не будет массивом себя.

Попробуйте вместо этого:

updateFriends: function(friend) { 
    const newFriends = [ ...this.state.friends, friend ]; 
    this.setState({ 
    friends: newFriends, 
    }); 
}, 
+0

большое вам спасибо! – vuvu

Смежные вопросы