维.如何获取“键"的值?创建元素中的属性 [英] Vue. How to get a value of a "key" attribute in created element

问题描述

我尝试创建一个组件并获取其在 axios 中使用的密钥.元素已创建，但我无法获取密钥.未定义

<paddock is="paddock-item" v-for="围场中的paddock" :key="paddock.key" class="paddock"></围场>
<脚本>var pItem = {道具:['key']，模板:'<div :test="key"></div>',创建:函数(){控制台日志(键)；}};新的 Vue({el: '#root',成分: {'围场项目':pItem},数据: {围场:[{键:1}，{键:2}，{键:3}，{键:4}]}})

我尝试了一些变体，但没有结果 - @key 为空.

解决方案

这个答案回答了如何将密钥传递给子组件的问题.如果您只想从子组件内部获取当前密钥，请使用投票最高的答案.<小时>key 是 Vue 中的一个特殊属性.您将不得不将您的财产称为其他名称.

这是使用 pkey 代替的替代方法.

console.clear()var pItem = {道具:['pkey']，模板:'<div :test="pkey"></div>',创建:函数(){控制台日志(this.pkey);}};新的 Vue({el: '#root',成分: {'围场项目':pItem},数据: {围场:[{关键:1},{关键:2},{关键:3},{钥匙:4}]}})

<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.4.2/vue.js"></script><div class="container" id="root"><paddock-item v-for="围场中的围场" :pkey="paddock.key" :key="paddock.key" class="paddock"></paddock-item>

I try to create a components and get its key for using in axios. Elements created, but I can't get a key. It's undefined

<div class="container" id="root">
    <paddock is="paddock-item" v-for="paddock in paddocks" :key="paddock.key" class="paddock">
    </paddock>
</div>
<script>
var pItem = {
    props: ['key'],
    template: '<div :test="key"></div>',
    created: function() {
        console.log(key);
    }
    };
new Vue({
    el: '#root',
    components: {
        'paddock-item': pItem
    },
    data: {
        paddocks: [
            {key: 1},
            {key: 2},
            {key: 3},
            {key: 4}
        ]
    }
})
</script>

I try some variants, but no result - @key was empty.

解决方案

This answer answers the question of how you would pass the key to a child component. If you just want to get the current key from inside the child component, use the highest voted answer.

---

key is a special attribute in Vue. You will have to call your property something else.

Here is an alternative using pkey instead.

console.clear()
var pItem = {
  props: ['pkey'],
  template: '<div :test="pkey"></div>',
  created: function() {
    console.log(this.pkey);
  }
};
new Vue({
  el: '#root',
  components: {
    'paddock-item': pItem
  },
  data: {
    paddocks: [{
        key: 1
      },
      {
        key: 2
      },
      {
        key: 3
      },
      {
        key: 4
      }
    ]
  }
})

<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.4.2/vue.js"></script>
<div class="container" id="root">
  <paddock-item v-for="paddock in paddocks" :pkey="paddock.key" :key="paddock.key" class="paddock">
  </paddock-item>
</div>

这篇关于维.如何获取“键"的值?创建元素中的属性的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！