How to create and call functions with parameters in vue js?

T

tripcollor2018-07-05 19:10:07

Vue.js

tripcollor, 2018-07-05 19:10:07

It is necessary that a design of this kind was worked out, how to achieve this? If you do not take into account what can be written to the data variable, change it and use it in the function instead of a parameter.

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <title>Document</title>
  <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
</head>
<body>
  <div id="app1">
    <input type="number" v-model="param">
    <ul>
      <li>{{ result }}</li>
    </ul>
  </div>


  <script>
    var app = new Vue({
      el: '#app1',
      data: {
        param: 3100,
        result: null,
      },
      created: function () {
        this.calcResult(3);
      },
      watch: {
        param: function() {
          this.calcResult(30);
        }
      },
      computed: {
        calcResult: function(value) {
          this.result = this.param + value;
        }
      }
    });
  </script>
</body>
</html>

Reply

Answer the question

In order to leave comments, you need to log in

1 answer(s)

0

0xD34F, 2018-07-05
@tripcollor

1) replace computed with methods
2) add number modifier to v-model