vue 點擊按鈕幾種總結

1. 點擊按鈕跳轉到新頁面

<el-button type="text" icon="el-icon-plus" @click="add"></el-button>


export default {
  methods: {
    add () {
      this.$router.push({path: '/home'})
    }
  }
}

2. 跳轉到有參數的頁面， 如 /home/1 , /home/2 那種的

<el-button type="text" icon="el-icon-plus" @click="add"></el-button>

export default {
  methods: {
    add () {
      this.$router.push({path: '/home/' + res.data.id})
    }
  }
}

3. 點擊出對話框二次確認 ( 一般是點擊刪除的時候）

<el-button type="text" icon="el-icon-delete" @click="deleteVisible = true"></el-button>

<el-dialog
    title="提示"
    :visible.sync='deleteVisible'
    width="30%">
    <span>確認刪除？</span>
    <span slot="footer" class="dialog-footer">
      <el-button @click="deleteVisible = false">取消</el-button>
      <el-button @click="delete_info">確認</el-button>
    </span>
</el-dialog>


export default {
  methods: {
    delete_info () {
      this.deleteVisible = false
      this.$router.push({path: '/home/' + this.$route.params.id})
    }
  }
}