Vue.js 在低端设备上应用时的用户体验问题

[Plumes]

在使用一些比较低端的设备访问使用了 Vue.js 的页面时，会出现模版代码一闪而过，部分用户会认为是乱码 比如模版里用到了

<h1>{{ title }}</h1>

用户在页面加载时就会看到一个特别大的 {{ title }} 这个问题有没有什么好的方法可以避免？

[Troevil]

参考 http://vuejs.org.cn/api/#v-cloak

[sox]

这和设备没关系。。

[sox]

这和设备没关系。。

[subpo]

[v-cloak] {
display: none;
}

[Plumes]

@Troevil @subpo 试了一下，效果好像不是很理想

[adeweb]

<h1 v-text='title'></h1>
为啥不这么写？

[Plumes]

@Troevil @subpo 尝试在使用模版的父级 div 上使用 v-cloak ，就可以了

[adeweb]

另外区块级别的你可以默认给个隐藏，然后 :class="{'z-show':dataLoaded}"， dataLoaded 在你完成数据加载后给它赋值 true 就行。

[Plumes]

@adeweb 不太喜欢这种数据和属性混在一起的写法

[njstt]

可以与 webpack 混合使用 http://vuejs.org.cn/guide/application.html

[adeweb]

@Plumes 嗯，我反倒不喜欢{{}} :)