Vue.js组件如何销毁重新创建


我有一个页面,上边是一些tab,下边是一个form页面。点击不同的tab,form页面的结构都相同,只是加载不同的数据在里面。

现在遇到的问题是,例如:

  1. form中有个checkbox,应该在每个tab被点中时都为unchecked,所以应状态不依赖其他数据

  2. 但是由于每个tab点中时显示的是同一个form的vue component,checkbox的值会保留上一个tab中被checked的状态

    我想做的是:

  3. 每个tab还是重用同样的component

  4. 但是希望在点中tab时,先销毁当前的,然后再“new”一个

    所以,Vue.js中怎么销毁再new一个呢?或者说我的case中有其他更合适的解决方案么?

vue JavaScript

轻点妹子。疼 9 years ago

demo
http://codepen.io/Yunkou/pen/qOgqxe

上班偷着写的,代码不是很工整见谅,意思下。不知道get到你的问题没有。


以下是和你的问题吻合,如果不吻合请忽略。
使用 Vue.js 一段时间,最大的感触是观念上的转变,眼睛不要盯着DOM去操作了。要盯着数据。 Vue.js 是数据驱动的,所以上来你应该想的是如何组织你的数据。

拙见 希望能帮到你。

AsexJR answered 9 years ago

Your Answer