Question

当我想将我的变量作为props从一个vue.js文件添加到另一个文件时，它将不起作用。我已经看到这个问题很普遍，但是答案却无济于事。我看不到代码有什么问题。也许您可以看一下：

ladedaten.vue ：（路径：src \ components \ ladedaten.vue）

<template>
    <div id="Ladedaten">
        <LadevorgangAendern v-bind:preis="preis"/>  
    </div>
</template>

<script>
import LadevorgangAendern from '../pages/LadevorgangAendern.vue'

export default {
    name: 'Ladedaten',
    components: {LadevorgangAendern},
    data() {
        return {
        preis: 15,           

        }
    },  
}
</script>

LadevorgangAendern.vue（路径：src \ pages \ LadevorgangAendern.vue）

<template>
    <!--Stuff here-->
    <p>Preis: {{preis}}</p>
</template>

<script>
//some imports here

export default {
    name: 'LadevorgangAendern',
    props: ['preis'],

    data() {
        return {
            //variables 
        }
    }
}

//more stuff here
</script>

事实上，我什至不确定组件是否是我所需要的。我想临时存储数据，因此当此方法可行时，我计划再次从props另一个页面文件中获取值ladedaten.vue。最后，我需要这些值可以临时更改。我也想到过会议，但我想先尝试使用组件。你们怎么看？

Answer 1

在LadevorgangAendern.vue中，尝试

<p>Preis: {{ this.preis }}</p>

也许尝试在应用程序中包括vuex状态管理。视您要访问数据的频率或位置而定，这是在整个应用中创建单一状态的好方法，而无需持续传递props或将它们放回备份或使用事件总线。

https://vuex.vuejs.org/

Vue组件：道具未定义

1 个答案: