Bagaimana untuk terus melaksanakan sekeping kod dalam vue

Vue.js ialah rangka kerja JavaScript progresif untuk membina antara muka pengguna Kelebihan utamanya ialah ia boleh melaksanakan pengikatan data dua hala, pembangunan komponen dan pengurusan modular. Dalam pembangunan Vue, kadangkala kita perlu melaksanakan beberapa kod tertentu, seperti pelaksanaan berjadual, dan tidak akan berhenti sehingga syarat tertentu dicapai. Artikel ini akan memperkenalkan cara melaksanakan kaedah melaksanakan sekeping kod secara berterusan dalam Vue.

1. Gunakan kaedah setInterval

Kaedah setInterval() boleh melaksanakan kod yang ditentukan dalam selang masa yang ditentukan. Dalam Vue, kita boleh menggunakan kaedah setInterval() dalam komponen untuk melaksanakan pelaksanaan kod berjadual. Berikut ialah contoh:

export default {
  data () {
    return {
      counter: 0
    };
  },
  mounted () {
    setInterval(() => {
      this.counter++;
    }, 1000);
  }
}

Dalam kod di atas, kita mula-mula mentakrifkan pembolehubah pembilang sebagai pembilang, dan kemudian gunakan kaedah setInterval() dalam fungsi cangkuk kitaran yang dipasang bagi komponen untuk melaksanakannya setiap 1 saat. Fungsi tanpa nama yang menambah 1 pada nilai pembilang. Dengan cara ini kod boleh dilaksanakan sekali-sekala.

2. Gunakan kaedah setTimeout

Kaedah setTimeout() boleh melaksanakan kod yang ditentukan selepas masa yang ditentukan, sama dengan pemasa dalam JavaScript. Dalam Vue, kita boleh menggunakan kaedah setTimeout() untuk melaksanakan fungsi melaksanakan sekeping kod secara berterusan. Berikut ialah contoh:

export default {
  data () {
    return {
    };
  },
  methods: {
    execute() {
      console.log('执行代码');
      setTimeout(() => {
        this.execute();
      }, 1000);
    }
  },
  mounted() {
    this.execute();
  }
}

Dalam kod di atas, kami mengisytiharkan fungsi yang dinamakan laksana Dalam badan fungsi, kami menggunakan kaedah console.log() untuk mencetak maklumat "kod pelaksanaan". , dan gunakan kaedah setTimeout () terus melaksanakan fungsi laksana selepas 1 saat. Panggil fungsi laksana dalam fungsi cangkuk kitaran yang dipasang komponen. Dengan cara ini, fungsi melaksanakan kod setiap 1 saat boleh dicapai.

3 Gunakan kaedah jam tangan

Dalam Vue, anda juga boleh menggunakan kaedah jam tangan untuk melaksanakan sekeping kod secara berterusan. Kaedah jam tangan boleh memantau perubahan dalam data dan melaksanakan kod yang ditentukan apabila data berubah. Berikut ialah contoh:

export default {
  data () {
    return {
      counter: 0
    };
  },
  watch: {
    counter () {
      setTimeout(() => {
        this.counter++;
      }, 1000)
    }
  },
  mounted() {
    this.counter++;
  }
}

Dalam kod di atas, kami mengisytiharkan pembolehubah bernama pembilang sebagai pembilang, kemudian mendengar perubahan dalam pembilang dalam jam tangan komponen, dan menggunakan kaedah setTimeout() apabila ia berubah Jadikan nilai pembilang meningkat sebanyak 1 selepas 1 saat. Dalam fungsi cangkuk kitaran yang dipasang bagi komponen, kami memanggil nilai pembilang, dengan itu mencetuskan acara mendengar jam tangan.

Ringkasan

Fungsi melaksanakan sekeping kod secara berterusan dalam Vue boleh direalisasikan melalui kaedah setInterval(), kaedah setTimeout() dan kaedah perubahan pemantauan menonton. Apabila menggunakan kaedah ini, anda perlu memberi perhatian sama ada terdapat kebocoran memori dan masalah lain dalam kod untuk mengelakkan pengecualian program.

Atas ialah kandungan terperinci Bagaimana untuk terus melaksanakan sekeping kod dalam vue. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!