<Rail v-if="currentComponent === 'Rail'" />
<Location v-if="currentComponent === 'Location'" /> <Monitor v-if="currentComponent === 'Monitor'" />
</template> <script> import Rail from "@/views/rail/rail.vue"; import Video from "@/views/video/video.vue"; import Location from "@/views/location/location.vue"; import Monitor from "@/views/monitor/monitor.vue"; let viewer; Cesium.Ion.defaultAccessToken = "eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJqdGkiOiJlYzc0OGZjYi03NDY5LTRmMmQtYTc2YS05ZTY2YzZlMTRmYTQiLCJpZCI6MTM5MzQ0LCJpYXQiOjE2ODQzMTI2MjF9.nNF8IyvsjDSdeRJeea8ftf4TC1DOgSa_jue-ZZ0dZ8M"; export default { name: "MineHome", components: { Rail, Video, Location, Monitor, }, data() { return { currentComponent: "Rail", currentTab: "", // 记录当前选中的按钮 buttonStyle: { // 记录按钮样式 Rail: true, Video: false, Location: false, Monitor: false, }, }; }, mounted() { this.toggleComponent("Rail"); this.initMap(); }, methods: { // 初始化地图 initMap() { viewer = new Cesium.Viewer("mapTree", { infoBox: false, // 禁用infoBox }); // 加载倾斜模型 var tileset = new Cesium.Cesium3DTileset({ url: "http://47.104.159.54:8156/out2/tileset.json", }); viewer.scene.primitives.add(tileset); viewer.zoomTo(tileset); }, toggleComponent(componentName) { this.currentComponent = componentName; }, }, }; 根据这段代码实现 默认选中按钮字体颜色为红色 非选中为白色
我的内容管理
展开
