Truyền dữ liệu vào component trong JavaScript

Từ component cha, có thể truyền dữ liệu vào component con. Để làm điều này, trong thẻ component cần viết các thuộc tính chứa dữ liệu. Ví dụ, hãy truyền tên và họ của người dùng:

App.vue<template>
  <User name="john" surn="smit" />
</template>

Dữ liệu được truyền như vậy được gọi là props. Để component nhận được dữ liệu này, cần liệt kê tên của chúng trong cấu hình props:

components/User.vue<script>
  export default {
    props: ['name', 'surn'],
    data() {
      return {
        
      }
    }
  }
</script>

Bây giờ dữ liệu được truyền có thể được hiển thị trong phần hiển thị của component con:

components/User.vue<template>
  {{ name }}
  {{ surn }}
</template>