Vuejs - lỗi dễ gặp khi sử dụng v-model và nested object
TIL
781
vuejs
16
Javascript
316
White

Tùng Quân viết ngày 27/05/2018

Vuejs - lỗi dễ gặp khi sử dụng v-model và nested object

v-model chỉ tự động tạo reactive properties cho các properties thuộc 1 level deep của model

Code lỗi

<template>
    <input v-model="foo.bar"> // this will work
    <input v-model="foo.bar.baz"> // Exception: cannot read property 'baz' of undefined
</template>

<script>
export default {
  ....
  data() {
    return {
      foo: { }
    };
  }
}
</script>

Code đúng, phải khai báo toàn bộ các properties từ level 2 deep trở xuống nếu có.

<template>
    <input v-model="foo.bar"> // this will work
    <input v-model="foo.bar.baz"> // this will work
</template>

<script>
export default {
  ....
  data() {
    return {
      foo: {
        bar: {
          baz: undefined
         }
       }
    };
  }
}
</script>

References:
1) https://github.com/vuejs/vue/issues/3732
2) https://github.com/vuejs/vue/issues/5932

Bình luận


White
{{ comment.user.name }}
Bỏ hay Hay
{{comment.like_count}}
Male avatar
{{ comment_error }}
Hủy
   

Hiển thị thử

Chỉnh sửa

White

Tùng Quân

3 bài viết.
1 người follow
Kipalog
{{userFollowed ? 'Following' : 'Follow'}}
Cùng một tác giả
White
5 1
The fastest request is the one that is never sent. Mục tiêu: tăng tốc độ trang web, bằng cách giảm thiểu số lượng request từ browser đến server thô...
Tùng Quân viết 2 năm trước
5 1
Bài viết liên quan
White
70 8
Tăng sức mạnh cho javascript với lodash Lần này mình sẽ giới thiệu 1 thư viện javascript vô cùng bá đạo có tên là "lodash]1]", có thể nói nó là LI...
Huy Hoàng Phạm viết hơn 5 năm trước
70 8
White
10 1
_Có mấy chia sẻ nhỏ, mình muốn đưa ra để mọi người cùng thảo luận góp ý. Thread này không tập trung vào Technical nữa mà discuss về Coding Style & ...
Hùng Phong viết hơn 2 năm trước
10 1
{{like_count}}

kipalog

{{ comment_count }}

bình luận

{{liked ? "Đã kipalog" : "Kipalog"}}


White
{{userFollowed ? 'Following' : 'Follow'}}
3 bài viết.
1 người follow

 Đầu mục bài viết

Vẫn còn nữa! x

Kipalog vẫn còn rất nhiều bài viết hay và chủ đề thú vị chờ bạn khám phá!