Asked Nov 27th, 2018 3:03 a.m. 268 0 1
  • 268 0 1
+1

Thay thế thẻ html bằng 1 component vuejs

Share
  • 268 0 1

em đang làm 1 trang bằng vuejs cho phép sửa đổi nhiều ô trong 1 bảng giống như thằng Word. Hiện tại, em làm mỗi ô là 1 component ckeditor. Tuy nhiên, vì có quá nhiều component ckeditor nên thời gian render của trang rất lâu. Bây giờ em muốn khi người dùng click vào mỗi ô trong bảng thì ta sẽ append 1 component ckeditor. Vấn đề ở chỗ, em dùng hàm replaceWith của thằng js thì nó chỉ thay thế html, còn các phần của thằng vue như @click, @blur, v-model thì không sử dụng được. Có ai biết thì giúp em với ạ.

1 ANSWERS


Answered Nov 27th, 2018 3:13 a.m.
+1

Bạn thử tách cái CKEditor thành một component riêng, có một method để get dữ liệu, hoặc emit một event khi dữ liệu bị sửa đổi. Sau đó dùng v-if="editing". Ô nào click sửa thì editing = true, editor mới render và hiện ra cho phép sửa.

<table-cell>
  <ck-editor v-if="editing" :value="contents" @change="onChange"/>
</table-cell>
Share
Avatar Nguyen Van Nam @2751997nam
Nov 27th, 2018 3:19 a.m.

vấn đề là trong trang có nhiều chỗ cần sử dụng ckeditor, khi edditing = true thì nó sẽ render hàng loạt luôn

0
| Reply
Share
Nov 27th, 2018 3:21 a.m.

@2751997nam Mỗi cell có một editing. Chỗ nào bạn cần sửa thì enable cell đấy lên.

+1
| Reply
Share
Viblo
Let's register a Viblo Account to get more interesting posts.