VueJS - Доступ к нескольким данным одним способом - PullRequest
Новая
       17

VueJS - Доступ к нескольким данным одним способом

0 голосов
/ 18 июня 2020

Я новичок в Vue и пытаюсь написать функцию, которая возвращает true или false для заданных данных при изменении ввода. У меня есть 4 разных данных, которые мне нужны, возможно, чтобы изменить правдивость.

Мой лог c должен был создать функцию, которая принимает данные как параметр, но ... Это не работает. Возможно, это неправильный способ go для ...

Здесь HTML: 

<input type="text" v-model="bannerContent.button" @input="checkMaxChar(48,bannerContent.button.length,isButtonTooLong)" id="banner-button">

И JS

var app = new Vue({
  el: '#app',
  data: {
    bannerContent: {
      title : 'Title',
      text: 'Text',
      copyright: 'Copyright',
      button: 'Button'
    },
    isButtonTooLong: false,
  },
  methods: {
    checkMaxChar: function(a,b,c) {
      var vm = this
      if( a < b ) {
        vm.c = true;
      };
      console.log(this.c);
    }
  }
})

1 Ответ

1 голос
/ 18 июня 2020

Я не уверен, почему вы делаете var vm = this, а также где вы определили c?

для своей цели, определите c в разделе данных, как код ниже, и работайте с вашим вводом : 

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <script src="https://cdn.jsdelivr.net/npm/vue"></script>
    <title>Document</title>
  </head>
  <body>
    <div id="app">
      <input
        type="text"
        v-model="bannerContent.button"
        @input="checkMaxChar(48,bannerContent.button.length,isButtonTooLong)"
        id="banner-button"
      />
    </div>
  </body>
  <script>
    var app = new Vue({
      el: "#app",
      data: {
        bannerContent: {
          title: "Title",
          text: "Text",
          copyright: "Copyright",
          button: "Button",
        },
        isButtonTooLong: false,
        c: false,
      },
      methods: {
        checkMaxChar(a, b, c) {
          if (a < b) {
            this.c = true;
          }
          console.log(this.c);
        },
      },
    });
  </script>
</html>

Надеюсь, это вам поможет;)

...