Einführung in berechnete Eigenschaften in vue.js

Der Inhalt dieses Artikels ist eine Einführung in die berechneten Eigenschaften von vue.js. Er hat einen gewissen Referenzwert.

• berechnete Methode
  - deklariert eine berechnete Eigenschaft „reversedMessage“. Die bereitgestellte Funktion wird als Getter für die Eigenschaft vm.reversedMessage verwendet. vm.reversedMessage hängt von vm.message ab. Wenn sich vm.message ändert, wird auch vm.reversedMessage aktualisiert.

<p id="app">
  <p>原始字符串: {{ message }}</p>
  <p>计算后反转字符串: {{ reversedMessage }}</p></p><script>var vm = new Vue({
  el: &#39;#app&#39;,
  data: {
    message: &#39;Runoob!&#39;
  },
  computed: {    //计算属性的getter
    reversedMessage: function () {
      // `this指向vm实例
      return this.message.split(&#39;&#39;).reverse().join(&#39;&#39;)
    }
  }
})</script>

• Methodenmethode
  -Der Effekt ist derselbe, aber die Berechnung basiert auf seinem Abhängigkeitscache und nur die relevanten Abhängigkeiten ändern den Wert wird erst dann neu bewertet. Bei Methoden wird die Funktion beim erneuten Rendern immer erneut aufgerufen und ausgeführt.

methods: {
  reversedMessage2: function () {
    return this.message.split('').reverse().join('')
  }
}

• Das berechnete Attribut verfügt standardmäßig nur über einen Getter, Sie können jedoch bei Bedarf auch einen Setter bereitstellen: Wird zum Aktualisieren des ursprünglichen Attributs

• berechnete Methode

  – deklariert eine berechnete Eigenschaft „reversedMessage“. Die bereitgestellte Funktion wird als Getter für die Eigenschaft vm.reversedMessage verwendet. vm.reversedMessage hängt von vm.message ab. Wenn sich vm.message ändert, wird auch vm.reversedMessage aktualisiert.
  

<p id="app">
  <p>原始字符串: {{ message }}</p>
  <p>计算后反转字符串: {{ reversedMessage }}</p></p><script>var vm = new Vue({
  el: &#39;#app&#39;,
  data: {
    message: &#39;Runoob!&#39;
  },
  computed: {    //计算属性的getter
    reversedMessage: function () {
      // `this指向vm实例
      return this.message.split(&#39;&#39;).reverse().join(&#39;&#39;)
    }
  }
})</script>

• Methodenmethode

  -Der Effekt ist derselbe, aber die Berechnung basiert auf seinem Abhängigkeitscache und nur die relevanten Abhängigkeiten ändern den Wert wird erst dann neu bewertet. Bei Methoden wird die Funktion beim erneuten Rendern immer erneut aufgerufen und ausgeführt.
  

methods: {
  reversedMessage2: function () {
    return this.message.split('').reverse().join('')
  }
}

• Das berechnete Attribut verfügt standardmäßig nur über einen Getter, Sie können jedoch bei Bedarf auch einen Setter bereitstellen: Wird zum Aktualisieren des ursprünglichen Attributs

Das obige ist der detaillierte Inhalt vonEinführung in berechnete Eigenschaften in vue.js. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!