Why isn't Vue updating the HTML?

A

andreys752017-09-15 12:55:33

Vue.js

andreys75, 2017-09-15 12:55:33

I decided to try to work with vue, but something got stuck on the simplest behavior. I can't figure out why the page isn't refreshing. There is this code:

<html>
    <header>
    <script src="https://unpkg.com/vue"></script>
  </header>
  <body>
    <div id="card">
      <div>{{cardData[0]}}</div>
      <div>{{cardData[1]}}</div>
    </div>
    <script>
      var data ={
          cardData:["1","2"],
          showType:true
        };
        
      var app = new Vue({
        el:"#card",
        data: data
        })
    </script>
  </body>
  
</html>

Everything is displayed correctly on the page,
Then I write in the console , but nothing changes on the page: What am I doing wrong? data.cardData[0]='jgvv'

Reply

Answer the question

In order to leave comments, you need to log in

1 answer(s)

0

0xD34F, 2017-09-15
@andreys75

Vue can't track directly setting a value by index.
Use set : . Or splice: . Vue.set(data.cardData, 0, 'hello, world!!');
data.cardData.splice(0, 1, 'fuck the world');