如何將變量傳遞給函數（在Vue2內部計算）？

Question

我嘗試使用vue2.js

代碼： http ： //jsbin.com/futuqoniso/1/edit？html，js

控制台： http ： //output.jsbin.com/futuqoniso/1

但是變量“ sort”始終是不確定的。 如何正確傳遞它的功能？

computed: {
    sortedArray: function() {
      function compare(a, b, sort) {

        console.log(sort);

        if (a.name < b.name)
          return -1;
        if (a.name > b.name)
          return 1;
        return 0;
      }

      return this.arrays.sort(compare);
    }
  }

我嘗試了“ this.sort”和其他變體...

Answer 1

您可以通過指定關鍵字this來訪問任何數據屬性，例如：

console.log(this.sort) 

這應該是：

    <a href="#" @click="sort = 'name'">name</a> 
    <a href="#" @click="sort = 'sex'">sex</a>

不：

    <a href="#" @click="sort = name">name</a> 
    <a href="#" @click="sort = sex">sex</a>

Answer 2

像這樣：

var string = new Vue({
  el: '#string',
  data: {

    sort: 'name',

    arrays: [{
      name: 'sonya',
      sex: 'woman'
    }, {
      name: 'sindell',
      sex: 'woman'
    }, {
      name: 'kano',
      sex: 'man'
    }, {
      name: 'subzero',
      sex: 'man'
    }]
  },
  computed: {
    sortedArray: function() {
      var sort = this.sort; // define variable from this
      function compare(a, b) {

        console.log(sort);

        if (a.name < b.name)
          return -1;
        if (a.name > b.name)
          return 1;
        return 0;
      }

      return this.arrays.sort(compare);
    }
  }
})

同時更新模板：

<p>{{sort}}
    Sort by: 
    <a href="#" @click="sort = 'name'">name</a> 
    <a href="#" @click="sort = 'sex'">sex</a>
  </p>