日韩性视频-久久久蜜桃-www中文字幕-在线中文字幕av-亚洲欧美一区二区三区四区-撸久久-香蕉视频一区-久久无码精品丰满人妻-国产高潮av-激情福利社-日韩av网址大全-国产精品久久999-日本五十路在线-性欧美在线-久久99精品波多结衣一区-男女午夜免费视频-黑人极品ⅴideos精品欧美棵-人人妻人人澡人人爽精品欧美一区-日韩一区在线看-欧美a级在线免费观看

歡迎訪問 生活随笔!

生活随笔

當(dāng)前位置: 首頁 > 前端技术 > vue >内容正文

vue

记一次vue2路由参数传递this指针问题

發(fā)布時(shí)間:2025/6/15 vue 47 豆豆
生活随笔 收集整理的這篇文章主要介紹了 记一次vue2路由参数传递this指针问题 小編覺得挺不錯(cuò)的,現(xiàn)在分享給大家,幫大家做個(gè)參考.

需要船體一個(gè)data()內(nèi)的對(duì)象到另一個(gè)頁面。

<player-card v-for="(note, key) in sortedtNodes":imgurl="note.avarUrl":playerId="note.playerId":title="note.playerName":label="note.kIndex"@click.native="$router.push({name: 'player_topics', params: { playerId: note.playerId, playerName: note.playerName, dateFroHome: this.date }})"></player-card>

在跳轉(zhuǎn)到的頁面卻并沒有獲取到,手動(dòng)打印一下是這樣的結(jié)果:

嘗試將參數(shù)設(shè)置為固定值:dateFroHome: '2017-04-28'這樣后端是可以獲取到的。所以這里確定是this指針問題。

所以這里的dateFroHome: this.date 的this是player-card組件里的this吧。

問題找出來了,怎么解決呢?

看了下官方文檔《組件數(shù)據(jù)流》中的內(nèi)容:

簡(jiǎn)單來說vue是不允許將父組件中的對(duì)象引用直接傳遞給子組件的,為了應(yīng)對(duì)這種情況,vue提供了兩種方法:

1.定義一個(gè)局部變量,并用 prop 的值初始化它:

props: ['initialCounter'], data: function () {return { counter: this.initialCounter } }

?

2.定義一個(gè)計(jì)算屬性,處理 prop 的值并返回。

props: ['size'], computed: {normalizedSize: function () {return this.size.trim().toLowerCase()} }

可以看這樣就能保證父組件的屬性this.xxx都保留在父組件中給你了。

所以我修改了一下項(xiàng)目:

在父組件的computed中定義一個(gè)啥啥啥:

computed: {thisDate: function () {var this_date = this.date;return this_date;}}

然后直接傳遞這個(gè)thisDate就可以了:

@click.native="$router.push({name: 'player_topics', params: { playerId: note.playerId, playerName: note.playerName, dateFroHome: thisDate }})"

?

轉(zhuǎn)載于:https://www.cnblogs.com/guazi/p/6798329.html

總結(jié)

以上是生活随笔為你收集整理的记一次vue2路由参数传递this指针问题的全部?jī)?nèi)容,希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯(cuò),歡迎將生活随笔推薦給好友。