Vue組件里Methods方法更新了數(shù)據(jù)如何重新渲染組件

在Vue組件中，通過(guò)Methods里的的方法修改了Data返回對(duì)象中的值，但是整個(gè)頁(yè)面并沒(méi)有根據(jù)修改的值進(jìn)行重新渲染

export default {
data () {

let page = this.$attrs['page']
let pageSize = this.$attrs['pageSize']
let dataBus = {
  newArticleData: [],
  page
}
console.log(page)
this.$a.get(`http://localhost:8081/api/article/page/${dataBus.page}/pageSize/${pageSize}`).then(res => {
  let json = res.data
  if (json.err === false) {
    dataBus.newArticleData = json.data[0]
  }
}, err => {
  console.log(err)
})

return dataBus

},
methods: {

addPage () {
  this.page++
  console.log(this.page)
}

}
}

回答

編輯回答

淚染裳

data中聲明變量不是應(yīng)該在return中嗎？
獲取后臺(tái)數(shù)據(jù)應(yīng)該在mounted 調(diào)用，
個(gè)人感覺(jué)，這個(gè)代碼結(jié)構(gòu)有點(diǎn)混亂

methods:{
    addPage(){
    this.page++;
    this.xxx()
    }
}

page ++后，再次調(diào)用那個(gè)依賴(lài)page參數(shù)的方法

2018年4月12日 18:40

編輯回答

陌上花

老鐵建議你去看一下 watch

2018年1月15日 21:00

編輯回答

故林

//老鐵 寫(xiě)法有問(wèn)題把
export default {
    data () {
        return {
            dataBus:{
                newArticleData: [],
                page: 0
            }
        }
    },
    created() {
        this.getData()
    },
    methods: {
        getData(){
            this.$a.get(`http://localhost:8081/api/article/page/${dataBus.page}/pageSize/${pageSize}`).then(res => {
              let json = res.data
              if (json.err === false) {
                this.dataBus.newArticleData = json.data[0]
              }
            }, err => {
              console.log(err)
            })
        }
    }
    //大致是這樣，不知道你哪調(diào)用了addPage

2017年8月7日 07:47