（vue学习笔记）不同页面间的跳转

提示：文章写完后，目录可以自动生成，如何生成可参考右边的帮助文档

前言

项目中经常要实现点击某处后不同页面的跳转，可以借助vue给我们的方法来实现跳转

使用步骤

1.使用@click处理点击事件

代码如下（示例）：

                    <div class="item-list">
                        <div class="item border-bottom" 
                        v-for="innerItem of item" 
                        :key="innerItem.id"
                        @click="handleCityClick(innerItem.name)">
                            {{ innerItem.name }}
                        </div>
                    </div>

2.在script中的方法中写出并使用

代码如下（以跳转到首页为例）：

this.$router.push('/')

完整的使用代码：

  methods: {
     handleCityClick(city){
    //  将city传入store中的changeCity
        this.$store.commit('changeCity',city)
    // 在点击改变城市后跳转到首页
        this.$router.push('/') 
     }
  }