設定方法のリストに関連付けられVUE +要素に対応する詳細を入力します

:機能を達成するために示すように1
ここに画像を挿入説明
2.
一覧(1)要素があり
、ここで1組<template slot-scope="scope">理解していない、説明の見ることができhttps://blog.csdn.net/tg928600774/article/details/81945140 ?は、utm_source = blogxgwz1

 <el-table-column label="详情" width="180">
      <template slot-scope="scope">
       <el-button type="text"  size="small" @click="handleView(scope.row.XXX)">详情</el-button>
          </template>
      </template>
    </el-table-column>

私は唯一の詳細このコラム書きこちらをクリックして
キーがリンクの問題をクリックすると、このXXXは、背景データ取得することです
。XXXは、あなたの背景JSON形式に依存し
、私は、バックグラウンドデータ接続のこのフォームを参照することができます理解していない(https://でblog.csdn.net/ShangMY97/article/details/103162168)
(2)ここでは、クリックイベントであります

handleView (name) {
        this.详情页面Visible = true
        this.$nextTick(() => {
          this.$refs.详情页面ViewDialog.initXqDialog(name)
        })
      }

(3)詳細ページ

initXqDialog(name){
        this.get详情Data(name)
        this.详情页面Visible = true  
}

*という注意详情页面Visibleリスト中の()*データ・ページ{デフォルトの戻り値がfalseを返します

get详情Data(name){
 	this.$http({
           url: this.$http.adornUrl('详情数据连接'),
           method: 'get',
           params: this.$http.adornParams({
					'name'=name
			})
    }).then(({data}) => {
    	console.log(JSON.stringify(data))
	})
}

'name'一覧ページに対応するデータにおける背景データの詳細については、name我々はデータを、対応するクリックイベントリストページに行きます

公開された38元の記事 ウォンの賞賛1 ビュー5166

おすすめ

転載: blog.csdn.net/ShangMY97/article/details/103274950