2016-08-26 4 views
1

私は単純なコード私だけrequrie暴動、test.tag私app.jsで暴動JS this.update奇妙な行動

<test> 
<ul> 
    <li each={ books }> { title }</li> 
</ul> 

<button type="button" name="button" onclick={ loadBooks }>Load books</button> 

<script> 
    'use strict'; 

    this.books = []; 
    let offset = 0; 

    this.on('mount',() => { 
    console.log('mounted'); 
    }); 

    this.on('update',() => { 
    console.log('updated'); 
    }); 

    loadBooks() { 
    fetch('/api/books?limit=10&offset='+offset) 
    .then(response => response.json()) 
    .then(books => { 
     offset+=10; 
     this.books = books; 
     // this.update(); 
    }) 
    .catch(err => console.log(err)); 
    } 
</script> 

を持っており、riot.mount('#root', 'test'); これは初期化画面、なぜ更新を行いますマウントの前に発射? enter image description here 私が最初にクリックしたとき、それはその更新をログには、解雇が、ビューが再描画されません enter image description here と私は内部this.update();のコメントを外す場合は、2番目のクリックの後 enter image description here enter image description here

を、イベントの更新が解雇やビューの再描画します約束、イベントの更新は二回発射します

UPD:this.books = booksを削除し、this.update({books});イベントの更新が二回起動されます、書き込み、および動作しますレンダリングが、なぜ2倍の場合は? mount

+0

jsを2回追加しましたか?時にはそれが2回処理されるイベントの原因です –

+0

いいえ、私は1つのバンドルファイルを持っています –

答えて