Apakah setiap komponen fail tunggal dalam vue terdiri daripada?

Komponen fail tunggal Vue terdiri daripada tiga bahagian: Templat: mentakrifkan perwakilan visual, menggunakan sintaks HTML. Skrip: Tentukan tingkah laku logik, menggunakan sintaks JavaScript. Gaya: Tentukan gaya, menggunakan sintaks CSS. . Ia ditulis menggunakan sintaks HTML dan boleh memaparkan data secara dinamik menggunakan arahan dan interpolasi Vue.

2. Skrip

Bahagian skrip mentakrifkan kelakuan logik komponen. Ia ditulis dalam JavaScript dan mengandungi data komponen, kaedah dan cangkuk kitaran hayat.

3. Gaya

Bahagian gaya menentukan gaya komponen. Ia boleh ditulis menggunakan sintaks CSS dan boleh mengandungi pemilih kelas, pemilih ID dan pertanyaan media.

Contoh:

<template>
  <div>
    <h1>{{ title }}</h1>
    <p>{{ message }}</p>
  </div>
</template>

<script>
export default {
  data() {
    return {
      title: 'Hello Vue',
      message: 'Welcome to the Vue world!'
    }
  }
}
</script>

<style>
h1 {
  color: blue;
}
p {
  color: red;
}
</style>

Dalam contoh ini:

Bahagian templat

mentakrifkan bekas div dengan tajuk dan mesej. Bahagian

skrip

mentakrifkan tajuk komponen dan data mesej. Bahagian

styles mentakrifkan sifat gaya unsur h1 dan p.

Atas ialah kandungan terperinci Apakah setiap komponen fail tunggal dalam vue terdiri daripada?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!