### 在應用中設置
* 創建mixin ,掛載 beforeRouteLeave 鉤子函數
### **Example**
~~~
const mixin = {
data(){
return{
isBack:false
}
},
computed:{
defaultPointer() {
return this.$store.getters.position[this.$route.name] ? this.$store.getters.position[this.$route.name]['xpath'] : false
//通過vuex獲取存儲的xpath
}
},
beforeRouteLeave(to, from, next) {
this.$service.pointer && this.$store.dispatch('pushPosition', {
name: from.name,
position: this.$service.getPointerPosition() || false
}) //使用vuex 記錄 焦點位置
if (this.isBack) {
this.$store.dispatch('pushPosition', {name: from.name, position: false}) //如果是返回操作,則設置焦點為false
}
this.$service.clear() //離開后清除已經綁定的組件
next();
},
methods: {
serviceBack() { //epg 示例默認綁定的back方法
this.isBack = true
if (this.back) {
this.back()
} else {
this.$router.go(-1)
}
}
},
}
export default Common {
name: "Common",
mixins: [mixin],
}
// 頁面繼承 Common
export default {
name: 'home',
extends: Common,
methods:{
back(){
this.$route.go(-1) //按下返回
}
},
mounted(){
let el = this.defaultPointer // 繼承了Common的computed,可以直接獲取 defaultPointer
this.$service.move(el) //移動到記錄焦點
}
}
~~~