質問編集履歴
6
</template>にバックスラッシュを記入
title
CHANGED
|
File without changes
|
body
CHANGED
|
@@ -30,7 +30,7 @@
|
|
|
30
30
|
<data-tables>
|
|
31
31
|
<el-table-column></el-table-column>
|
|
32
32
|
</data-tables>
|
|
33
|
-
<template>
|
|
33
|
+
</template>
|
|
34
34
|
<script>
|
|
35
35
|
</script>
|
|
36
36
|
```
|
5
追記
title
CHANGED
|
File without changes
|
body
CHANGED
|
@@ -23,6 +23,20 @@
|
|
|
23
23
|
どうすればこのエラーを解消できますでしょうか？
|
|
24
24
|
大変お手数だと思いますが、詳しい方のお力をお借りしたいです……
|
|
25
25
|
|
|
26
|
+
### 追記（実際に書いているコード）
|
|
27
|
+
|
|
28
|
+
```
|
|
29
|
+
<template>
|
|
30
|
+
<data-tables>
|
|
31
|
+
<el-table-column></el-table-column>
|
|
32
|
+
</data-tables>
|
|
33
|
+
<template>
|
|
34
|
+
<script>
|
|
35
|
+
</script>
|
|
36
|
+
```
|
|
37
|
+
タグの閉じ忘れ、インデントが可笑しい箇所がないか調べるため、
|
|
38
|
+
一度上記のコードだけにしてみたのですが、やはりエラーは変わらずでした。。。
|
|
39
|
+
|
|
26
40
|
#### 私が参照したリンクです
|
|
27
41
|
[nuxt.jsプラグインの入れ方](https://ja.nuxtjs.org/guide/plugins)
|
|
28
42
|
[vue-data-table](https://github.com/njleonzhang/vue-data-tables/blob/master/example/docs/en.vue)
|
4
誤字
title
CHANGED
|
File without changes
|
body
CHANGED
|
@@ -23,6 +23,9 @@
|
|
|
23
23
|
どうすればこのエラーを解消できますでしょうか？
|
|
24
24
|
大変お手数だと思いますが、詳しい方のお力をお借りしたいです……
|
|
25
25
|
|
|
26
|
+
#### 私が参照したリンクです
|
|
26
27
|
[nuxt.jsプラグインの入れ方](https://ja.nuxtjs.org/guide/plugins)
|
|
28
|
+
[vue-data-table](https://github.com/njleonzhang/vue-data-tables/blob/master/example/docs/en.vue)
|
|
29
|
+
|
|
27
30
|
###補足情報
|
|
28
31
|
vue / nuxt / javascript / 初心者
|
3
誤字
title
CHANGED
|
@@ -1,1 +1,1 @@
|
|
|
1
|
-
|
|
1
|
+
Vueのプラグインを入れたらエラーが出てしまいました……
|
body
CHANGED
|
@@ -1,19 +1,28 @@
|
|
|
1
|
+
閲覧してくださってありがとうございます。
|
|
2
|
+
私はvue初心者なんですが、ひょんなことからvueの知識が必要な
|
|
3
|
+
nuxt.config.jsというフレームワークを使って作業をしていたのですが…
|
|
4
|
+
|
|
5
|
+
私はテーブルを作成するため、vue-data-tableというプラグインを
|
|
6
|
+
|
|
1
7
|
```
|
|
2
8
|
plugins: [
|
|
3
9
|
{ src: '~plugins/vue-data-tables', ssr: false }
|
|
4
10
|
],
|
|
5
11
|
```
|
|
12
|
+
|
|
6
|
-
|
|
13
|
+
上記のようにいれました。画面上は問題なく動くのですが、
|
|
7
|
-
|
|
14
|
+
Consoleで確認すると下記のようなエラーが出てきてしまいます。
|
|
15
|
+
|
|
8
16
|
```
|
|
9
17
|
[Vue warn]: The client-side rendered virtual DOM tree is not matching server-rendered content.
|
|
10
18
|
This is likely caused by incorrect HTML markup, for example nesting block-level elements inside <p>, or missing <tbody>.
|
|
11
19
|
Bailing hydration and performing full client-side render.
|
|
12
20
|
```
|
|
13
21
|
|
|
22
|
+
何故このエラーが出るのか正直まったく分かりません(;O;)
|
|
14
|
-
どうすればこのエラーを解消でき
|
|
23
|
+
どうすればこのエラーを解消できますでしょうか？
|
|
15
|
-
大変お手数だと思いますが、詳しい方のお力をお借りしたいです……
|
|
24
|
+
大変お手数だと思いますが、詳しい方のお力をお借りしたいです……
|
|
16
25
|
|
|
17
|
-
|
|
26
|
+
[nuxt.jsプラグインの入れ方](https://ja.nuxtjs.org/guide/plugins)
|
|
27
|
+
###補足情報
|
|
18
|
-
|
|
28
|
+
vue / nuxt / javascript / 初心者
|
|
19
|
-
vue / nuxt
|
2
タイトル修正
title
CHANGED
|
@@ -1,1 +1,1 @@
|
|
|
1
|
-
|
|
1
|
+
クライアントサイド限定のプラグイン利用について（vue、nuxt）
|
body
CHANGED
|
File without changes
|
1
可読性UP
title
CHANGED
|
@@ -1,1 +1,1 @@
|
|
|
1
|
-
|
|
1
|
+
nuxt.jsでクライアントサイド限定のプラグイン利用について
|
body
CHANGED
|
@@ -1,18 +1,19 @@
|
|
|
1
|
-
### The client-side rendered virtual DOM tree is not matching server-rendered content.というエラーを解消したいです
|
|
2
|
-
[nuxt.js クライアントサイド限定のプラグイン利用](https://ja.nuxtjs.org/guide/plugins/)
|
|
3
|
-
を読みながら、ブラウザで表示させることは出来たのですが、
|
|
4
|
-
consoloeで確認すると、タイトルに書いてあるエラーが表示されてしまいます。
|
|
5
|
-
|
|
6
|
-
どうすればこのエラーを解消できるのでしょうか？
|
|
7
|
-
大変お手数だと思いますが、詳しい方のお力をお借りしたいです……(;O;)
|
|
8
|
-
|
|
9
|
-
###発生している問題・エラーメッセージ
|
|
10
|
-
|
|
11
1
|
```
|
|
2
|
+
plugins: [
|
|
3
|
+
{ src: '~plugins/vue-data-tables', ssr: false }
|
|
4
|
+
],
|
|
5
|
+
```
|
|
6
|
+
nuxt.config.jsでvue-data-tableのプラグインを上記のようにいれました。
|
|
7
|
+
問題なく動くのですが、下記のようなエラーが出てきます。
|
|
8
|
+
```
|
|
12
9
|
[Vue warn]: The client-side rendered virtual DOM tree is not matching server-rendered content.
|
|
13
10
|
This is likely caused by incorrect HTML markup, for example nesting block-level elements inside <p>, or missing <tbody>.
|
|
14
11
|
Bailing hydration and performing full client-side render.
|
|
15
12
|
```
|
|
16
13
|
|
|
14
|
+
どうすればこのエラーを解消できるのでしょうか？
|
|
15
|
+
大変お手数だと思いますが、詳しい方のお力をお借りしたいです……(;O;)
|
|
16
|
+
|
|
17
|
+
|
|
17
18
|
###補足情報(言語/FW/ツール等のバージョンなど)
|
|
18
19
|
vue / nuxt
|