請問如何更新整個vue.$data

我有一個對象代表一張單據(jù)

var bill={id:'aaa',store:'bbb'};

完了在new Vue時賦值給$data：

var vm = new Vue(el:'#billinfo', data: bill});

然后在html中呈現(xiàn)單據(jù)信息：

<div id='billinfo'>
  <p>單號：{{id}}</p>
  <p>店倉：{{store}}</p>
</div>

在頁面的交互中，bill可能會變成另一張單據(jù)，而我不想挨個更新單據(jù)屬性：

bill.id = 'xxx';
bill.store = 'yyy';

我想把bill整個替換掉，但改變bill的指向顯然不行：

bill = {id:'xxx', store: 'yyy'};

這樣也不行：

vm.$data = {id:'xxx', store: 'yyy'};

固然可以將bill作為$data的某個子屬性來構(gòu)造vm，例如：

var vm = new Vue({el:xx, data: {bill: bill}});

這樣在bill更新時便可以像這樣操作：

vm.bill = {id:'xxx', store: 'yyy'};

但問題是使用時就只能帶上這個屬性名來使用：

<p>單號：{{bill.id}}</p>
...

請問怎樣才能讓$data就是實體本身時，整個更新$data？又或者，即便實體屬于$data的某個子屬性，也能不帶屬性前綴來使用？