Trong Vue.js, mỗi khi bạn định nghĩa một component, thuộc tính data phải là một hàm (function) chứ không phải là một đối tượng trực tiếp. Điều này là bắt buộc vì mỗi instance của component cần phải có một bản sao riêng biệt của đối tượng data để tránh chia sẻ trạng thái giữa các instance, điều này có thể dẫn đến các vấn đề không mong muốn trong ứng dụng.
Khi bạn sử dụng một đối tượng trực tiếp cho data, tất cả các instance của component sẽ chia sẻ cùng một đối tượng data. Điều này có nghĩa là bất kỳ thay đổi nào trên một instance sẽ ảnh hưởng đến tất cả các instance khác, vì chúng đều tham chiếu đến cùng một đối tượng data.
