小编Mih*_*vic的帖子

如何评估data属性中的Vue.js组件道具?

我有2个组件:PostComments.

在Post组件中,有一个Comments组件有3个props:postId,numCom(注释数)和comments(数组).

我得到了注释,并使用props传递数组,现在我想在Comments组件中检索数组并将其添加到数据中,以便我可以添加/删除注释等.

这是我的代码Comments.vue:

props: ['id', 'numCom', 'comments'],
data: function() {
  return {
     newMessage: "",
     loading: false,
     allComments: this.comments,
     num: this.numCom,
   }
},
Run Code Online (Sandbox Code Playgroud)

但这不起作用.在Vue开发人员工具中,我可以看到commentsprop填充了注释,但allComments数组为空.

我该怎么办?

javascript vue.js vue-component vuejs2

15
推荐指数
1
解决办法
1万
查看次数

只有最后一个组件才能获得详细信息

我正在使用加密货币的应用程序,所以现在我有2个组件:MyCoins:

Vue.component('mycoins',{
data() {
    return {
        coins: [],
    }
},
template: `
    <ul class="coins">
        <coin v-for="(coin, key) in coins" :coin="coin.coin_name" :key="coin.coin_name"></coin>
    </ul>
`,
methods: {
    getStats() {
        self = this;
        axios.get('api/user/coins').then(function (response) {
            console.log(response.data.coins);
            self.coins = response.data.coins;
          })
          .catch(function (error) {
            console.log(error);
          });
    }
},
mounted() {
    this.getStats();
}
Run Code Online (Sandbox Code Playgroud)

})

在url'api/user/coins'上我得到这些数据:

{"coins":
[{"id":1,"coin_name":"ethereum","user_id":1,"buy_price_usd":"341.44000","buy_price_btc":"0.14400","created_at":"2017-09-25 20:40:20","updated_at":"2017-09-25 20:40:20"},
    {"id":2,"coin_name":"bitcoin","user_id":1,"buy_price_usd":"12.00000","buy_price_btc":"14.00000","created_at":"2017-09-25 21:29:18","updated_at":"2017-09-25 21:29:18"},
    {"id":3,"coin_name":"ethereum-classic","user_id":1,"buy_price_usd":"33.45000","buy_price_btc":"3.00000","created_at":"2017-09-25 21:49:50","updated_at":"2017-09-25 21:49:50"},{"id":4,"coin_name":"lisk","user_id":1,"buy_price_usd":"23.33000","buy_price_btc":"0.50000","created_at":"2017-09-25 21:51:26","updated_at":"2017-09-25 21:51:26"}]}
Run Code Online (Sandbox Code Playgroud)

然后我有这个组件:硬币:

Vue.component('coin',{
data() {
    return {
        thisCoin: this.coin,
        coinData: {
            name: "",
            slug: "",
            image: "https://files.coinmarketcap.com/static/img/coins/32x32/.png",
            symbol: …
Run Code Online (Sandbox Code Playgroud)

javascript vue.js vue-component vuejs2

0
推荐指数
1
解决办法
76
查看次数

标签 统计

javascript ×2

vue-component ×2

vue.js ×2

vuejs2 ×2