为什么我无法在HTML中显示值(来自Vue.js)

时间:2017-02-25 20:43:04

标签: vue.js interpolation instances

计算部分中的控制台日志给出了正确的结果(使用此),但是简单的插值总是停留在0的早期值...我做错了什么?

这是单独的实例(和单独的html页面)。使用事件总线我可以从主实例中获取值,但不能显示它。

代码:

<template>
<div class="container">
    <h2 class="text-center">Rezultati</h2>
    <button type="button" @click="napisi" id="idID">Show!</button>
    <input type="text" v-model="pogodjeno">{{ pogodjeno }}
    <p style="width:80%;margin-left:10%;" v-bind:pogodjeno="pogodjeno"> Ukupno pogodjenih: {{ pogodjeno }}</p>
    <p style="width:80%;margin-left:10%;" v-bind:vreme="vreme">Vreme: {{ vreme }} sec </p>
    <p id="procenat">50%</p>
    <div class="scorebar">fdddddddd
        <span class="pogoci">1</span>
        <span class="promasaji">2</span>
    </div>
    <div id="pokreniPonovo">
         <span>Ako zelite da probate jos jednom, kliknite na dugme pored</span>
         <button class="btn btn-info optionBtn2" type="button">Opet?</button>
         <p>{{ vreme }}</p>
    </div>

    

<script>
import { rezultatiBus } from './main';

export default {
    data: function() {
        return {
            vreme: 0,
            pogodjeno: 0
        };
    },

    computed: {
        output: function() {
            console.log(this.vreme);
            console.log(this.pogodjeno);
        }
    },

    created() {
        rezultatiBus.$on("novoVreme", (data) => {
            this.vreme = data;
        });

        rezultatiBus.$on("noviPokusaj", (data) => {
            this.pogodjeno = data;
        });
    }
};
</script>

0 个答案:

没有答案