質問編集履歴

2

vuefire導入後エラー追記

2018/01/06 03:20

投稿

you88
you88

スコア147

test CHANGED
File without changes
test CHANGED
@@ -71,3 +71,97 @@
71
71
 
72
72
 
73
73
  これでdataの3つの値をfirebaseに渡したいのですが上手く渡せていないです。。。
74
+
75
+
76
+
77
+
78
+
79
+ vuefireを導入しバインディングを試みました。
80
+
81
+ が、下記のエラーが出てしまい。。。
82
+
83
+
84
+
85
+ ```
86
+
87
+ import Vue from 'vue/dist/vue.esm';
88
+
89
+ import App from '../app.vue'
90
+
91
+ var Vue = require("vue");
92
+
93
+ var VueFire = require("vuefire");
94
+
95
+ var Firebase = require("firebase");
96
+
97
+
98
+
99
+ var firetalks = new Firebase("https://mchat-test-c402b.firebaseio.com/")
100
+
101
+ var chat = new Vue({
102
+
103
+ el: "#chat",
104
+
105
+ data: {
106
+
107
+ message: {
108
+
109
+ user_id:'',
110
+
111
+ board_id:'',
112
+
113
+ contents:'',
114
+
115
+ }
116
+
117
+ },
118
+
119
+ firebase: {
120
+
121
+ talks: firetalks
122
+
123
+ },
124
+
125
+ methods: {
126
+
127
+ addMessage: function(){
128
+
129
+ firetalks.push(this.message)
130
+
131
+ }
132
+
133
+ }
134
+
135
+ })
136
+
137
+ ```
138
+
139
+
140
+
141
+ html
142
+
143
+ ```
144
+
145
+ <div class="form-inline" id="chat">
146
+
147
+ <textarea v-model="message.user_id" class="hidden" value="<%= @current_user.id %>"></textarea>
148
+
149
+ <textarea v-model="message.board_id" class="hidden" value="<%= @post.id %>"></textarea>
150
+
151
+ <input type="text" name="" v-model="message.contents" class="col-sm-8 form-control show_form"></textarea>
152
+
153
+ <button type="submit" name="button" v-on:click="addMessage" class="btn btn-primary col-sm-3">送信</button>
154
+
155
+ </div>
156
+
157
+ ```
158
+
159
+
160
+
161
+ エラー内容
162
+
163
+ ```
164
+
165
+ firebase.js:136 Uncaught Error: Firebase.child failed: First argument was an invalid path: "talks/[object MouseEvent]". Paths must be non-empty strings and can't contain ".", "#", "$", "[", or "]"
166
+
167
+ ```

1

不足部分追加

2018/01/06 03:20

投稿

you88
you88

スコア147

test CHANGED
File without changes
test CHANGED
@@ -3,6 +3,8 @@
3
3
 
4
4
 
5
5
  ```
6
+
7
+ var firetalks = new Firebase('https://mchat-test-c402b.firebaseio.com/');
6
8
 
7
9
  var chat = new Vue({
8
10
 
@@ -44,6 +46,28 @@
44
46
 
45
47
  ```
46
48
 
49
+ html
50
+
51
+
52
+
53
+ ```
54
+
55
+ <div class="form-inline" id="chat">
56
+
57
+ <textarea v-model="message.user_id" class="hidden"><%= @current_user.id %></textarea>
58
+
59
+ <textarea v-model="message.board_id" class="hidden"><%= @post.id %></textarea>
60
+
61
+ <input type="text" name="" v-model="message.contents" class="col-sm-8 form-control show_form"></textarea>
62
+
63
+ <button type="submit" name="button" v-on:click="addMessage" class="btn btn-primary col-sm-3">送信</button>
64
+
65
+ </div>
66
+
67
+ ```
68
+
69
+
70
+
47
71
 
48
72
 
49
73
  これでdataの3つの値をfirebaseに渡したいのですが上手く渡せていないです。。。