通过路由跳转的方式实现。
在div定义一个最大化的按钮:
<el-tooltip :content="tips" placement="top"> <el-button @click="go"> <el-icon><full-screen /></el-icon> </el-button> </el-tooltip>
引入路相关模块:
import { FullScreen } from '@element-plus/icons' import router from '../../router' import { useRoute } from 'vue-router'
setup配置:
setup() { const route = useRoute() return { route } },
计算属性:
computed: { tips() { if (this.route.path === '/traffic_full_display') { return 'Cancel Full Screen' } else { return 'Full Screen' } }, },
方法:
methods: { go() { if (this.route.path === '/traffic_full_display') { router.push('/abstract_info') } else { router.push('/traffic_full_display') } }, },