vue.jsでvuefireでつなげた値をv-forで出したいんですが定義されていないとエラーが出てしまいます。
vue.esm.js:578 [Vue warn]: Property or method "messages" is not defined on the instance but referenced during render. Make sure that this property is reactive, either in the data option, or for class-based components, by initializing the property. See: https://vuejs.org/v2/guide/reactivity.html#Declaring-Reactive-Properties. (found in <Root>)
こちらがコードで
html
<div id="chat"> <ul> <li v-for="talk in talks" :key="message['.key']"> {{message.contents}} </li> </ul> <form v-on:submit.prevent="addMessage" class="form-inline" > <textarea v-model="message.user_id" class="hidden" value="1"></textarea> <textarea v-model="message.board_id" class="hidden" value=""></textarea> <input type="text" name="" v-model="message.contents" class="col-sm-8 form-control show_form"> <button type="submit" name="button" class="btn btn-primary col-sm-3">送信</button> </form> </div><!--chat-->
javascript
import Vue from 'vue/dist/vue.esm'; import App from '../app.vue' var VueFire = require("vuefire"); var Firebase = require("firebase"); var firetalks = firebase.database().ref('talks') var chat = new Vue({ el: "#chat", data: { message: { user_id:'', board_id:'', contents:'', } }, firebase: { talks: firetalks }, methods: { addMessage: function(){ firetalks.push(this.message) this.message.user_id = '' this.message.board_id = '' this.message.contents = '' } } })
https://jp.vuejs.org/v2/examples/firebase.html
このページを参考にしていてここでも
firebase: { users: usersRef },
でusersをバインディングしてそのusersを使っているのでそのとおりにしたんですがなぜか上記のえらーがでてしまいます。
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
2018/01/07 12:43
2018/01/07 12:51