search

zouyaoji / vue-cesium

🎉 Vue 3.x components for CesiumJS.
https://zouyaoji.top/vue-cesium
MIT License
1.49k stars 321 forks source link

知乎上有人说不要把viewer挂到this上，会严重影响性能， #95

Closed 531431988 closed 3 years ago

531431988 commented 3 years ago

[BUG 反馈] 知乎上有人说不要把viewer挂到this上，会严重影响性能，

浏览器版本号

最新

Vue 版本号

2.x

组件库版本号

x

现象描述

求解释

完整异常信息

求解释

在线示例 / 仓库 URL

https://zhuanlan.zhihu.com/p/157721176?from_voters_page=true

复现代码

求解释

预期输出

求解释

实际输出

求解释
FrozenQ commented 3 years ago

你理解的响应和常规属性的区别吧

531431988 commented 3 years ago

你理解的响应和常规属性的区别吧

cesium我还不会用，准备学一下，百度无意看到的 https://blog.csdn.net/abc553226713/article/details/106137701/

531431988 commented 3 years ago

image 官方解释，所以大佬写的这个没问题，是后来添加的不是响应的

zouyaoji commented 3 years ago

挂this问题不大，只要不写进data里面即可。如果非要写进data，那命名加个'_'或者'$'，vue都不会检测改变了。 把viewer放vuex也阔以的，不过放之前先Object.freeze()一下。以上都是让vue没有检测viewer属性的改变了。放window确实简单粗暴，但一般不推荐。

性能注意点大概还有2点： （1）件常用属性传参的时候建议写成简单对象。比如传实体的position属性，直接写成{lng: 180, lat: 35} 应该比 在外面用new Cesium.Cartesian3再传进去开销小一些。 （2）通过vue-cesium组件渲染大量对象的时候，优先使用集合属性。图元用图元集合，实体用数据源。具体可以参考在线文档。

531431988 commented 3 years ago

挂this问题不大，只要不写进data里面即可。如果非要写进data，那命名加个'_'或者'$'，vue都不会检测改变了。 把viewer放vuex也阔以的，不过放之前先Object.freeze()一下。以上都是让vue没有检测viewer属性的改变了。放window确实简单粗暴，但一般不推荐。

性能注意点大概还有2点： （1）件常用属性传参的时候建议写成简单对象。比如传实体的position属性，直接写成{lng: 180, lat: 35} 应该比 在外面用new Cesium.Cartesian3再传进去开销小一些。 （2）通过vue-cesium组件渲染大量对象的时候，优先使用集合属性。图元用图元集合，实体用数据源。具体可以参考在线文档。 感谢大佬，能在帮看一下这个问题吗 react版本: https://codepen.io/Aoobruce/pen/eYpwBbM?editors=0010 初始化选中和禁用状态正常 自己改的vue版本： https://codesandbox.io/s/antd-treetransfer-forked-4ohb9 初始选中有问题，禁用不知道怎么弄

zouyaoji commented 3 years ago

用render写我也不擅长啊。要不参考 官方例子 用模板语法写吧。

531431988 commented 3 years ago

用render写我也不擅长啊。要不参考 官方例子 用模板语法写吧。

我也不擅长，改了一个有问题