Question

我收到错误：[Vue warn]: Error in render: "ReferenceError: task is not defined". - ＆gt; {{ task.title }}。我理解它的意思，但我不明白为什么。我查看了很多示例，我理解的要点是如何从父组件传递属性，如：v-bind:some_prop或:some_prop以及子组件定义prop: ['some_prop']。也许它不允许传递js对象，但是我看到了一个例子，他们像这样传递它：:some_prop="{['first', 'second']}。比我想象的那样，那个对象可以通过，但是怎么样？

Tasks.vue：

<template>
    <div>
        <div id="tasks_wrapper">
            <div id="elements_wrapper">
                <div class="title">Tasks for today</div>
                <hr class="delimiter" />
                <ul id="tasks_list">
                    <task v-for="(task, index) in tasks_list" v-bind:task="task" v-bind:key="index"></task>
                </ul>
            </div>
        </div>
    </div>
</template>

<script>
    import Task from './Task.vue';

    export default {

        components: {
            Task
        },
        data() {
            return {
                tasks_list: []
            }
        },
        created() {
            this.tasks();
            setInterval(this.tasks, 300000);
        },
        methods: {
            tasks() {
                let that = this;
                axios.get('http://localhost/tasks')
                    .then(function (response) {
                        that.tasks_list = response.data;
                    })
                    .catch(function (error) {
                        console.log('Error! Could not reach the API. ' + error);
                    });
            }
        },
    };
</script>

Task.vue：

<template>
    <li>
        <div class="title" :style="style">{{ task.title }}</div>
    </li>
</template>

<script>

    export default {
        props: ['task'],

        data() {
            return {
                completed: false
            }
        },
        computed: {
            style: function () {
                if (task.status === 'completed') {
                    this.completed = true;
                }
            }
        }
    };

</script>

Answer 1

使用此class ForkOut extends PrintStream { // The other stream to write to. final PrintStream[] others; public ForkOut(PrintStream o1, PrintStream... others) { super(o1); this.others = others; } @Override public void write(int b) { super.write(b); // Echo every write to the other streams. for ( PrintStream o : others ) { o.write(b); } } @Override public void write(byte[] buf, int off, int len) { super.write(buf, off, len); // Echo every write to the other streams. for ( PrintStream o : others ) { o.write(buf, off, len); } } } public void test(String[] args) throws FileNotFoundException { System.out.println("Hello"); System.setOut(new ForkOut(System.out, new PrintStream(new FileOutputStream("output.txt")))); System.out.println("Hello again!"); }代替this.task.status＆amp;您需要在task.status

中将prop替换为props，如下所示

Task.vue

Vue - 未在子组件中定义的属性（对象）

1 个答案: