Vue Js未出现在刀片

时间:2017-04-27 08:08:52

标签: php laravel vue.js

我试图在我最近的项目上实现vue js因为我是新手我可能会做一些我无法捕捉的错误。我正在编写我遵循的步骤以使我的组件工作。如果你发现任何错误。我会帮你解决这个问题。

这是我的刀片视图:

<div class="panel-body">
                   <chat inline-template>

                        You are logged in!

                        <hr>

                        <h2>Write something to all users</h2>
                        <input type="text" class="form-control" placeholder="something" required="required" v-model="newMsg" @keyup.enter="press">            

                        <hr>
                        <h3>Messages</h3>

                        <ul v-for="post in posts">
                       <b>@{{ post.username }} says:</b> @{{ post.message }}</li>    
                        </ul>
                     </chat>
                </div>

app.js

require('./bootstrap');

window.Vue = require('vue');
Vue.component('example', require('./components/Example.vue'));
Vue.component('chat', require('./components/chat.vue')); 

const app = new Vue({
    el: '#app'
});

这是我的chat.vue

<script>
module.exports = {

    data() {
        return {
            posts: [],
            newMsg: '',

        }
    },


    ready() {
        Echo.channel('public-test-channel')
            .listen('ChatMessageWasReceived', (data) => {

                // Push ata to posts list.
                this.posts.push({
                    message: data.chatMessage.message,
                    username: data.user.name
                });
            });
    },

    methods: {

        press() {

            // Send message to backend.
            this.$http.post('/message/', {message: this.newMsg})
                .then((response) => {

                    // Clear input field.
                    this.newMsg = '';
                });
        }
    }
};
</script>

当我加载我的视图时,我没有看到任何内容。表示空白页。什么可能错误?提前致谢

1 个答案:

答案 0 :(得分:0)

你需要在组件周围有一个app div:


import tika
import sys
from tika import parser
from tika import detector
tikedDocument = parser.from_file(TextImage)

这是创建Vue应用程序的地方。

米克