サルでもわかるWEBプログラミング

フリーソフトのみでホームページ作成

ユーザ用ツール

サイト用ツール


07.vue.jsでクイズアプリ:index.html


差分

このページの2つのバージョン間の差分を表示します。

この比較画面へのリンク

両方とも前のリビジョン前のリビジョン
次のリビジョン
前のリビジョン
07.vue.jsでクイズアプリ:index.html [2018/12/13] – [2. index.htmlの編集] adash33307.vue.jsでクイズアプリ:index.html [2018/12/13] (現在) – [3. src/App.vueの編集] adash333
行 23: 行 23:
 ソースコード ソースコード
  
 +https://codesandbox.io/s/68rnrr893
  
 これから作るもの これから作るもの
- 
- 
  
 <html> <html>
 +<iframe src="https://codesandbox.io/embed/68rnrr893" style="width:100%; height:500px; border:0; border-radius: 4px; overflow:hidden;" sandbox="allow-modals allow-forms allow-popups allow-scripts allow-same-origin"></iframe>
 </html> </html>
  
行 84: 行 82:
  
 ==== 3. src/App.vueの編集 ==== ==== 3. src/App.vueの編集 ====
 +次に、画面左側のファイルリストで、srcをクリックして、ドロップダウンで出てくる、App.vueを選択すると、以下のような画面になります。
  
 +{{:07.vue.jsでクイズアプリ:pasted:20181213-091253.png}}
 +
 +こちらを、以下のコードに書き換えます。
  
 <html> <html>
 +<script src="https://gist.github.com/adash333/6193d1a8cfccb5387164679bcd078ee7.js"></script>
 +</html>
  
 +(変更後)
 +{{:07.vue.jsでクイズアプリ:pasted:20181213-093451.png}}
  
 +参考:https://blog.capilano-fw.com/?p=2499
  
-</html>+参考2:data property in component must be a function
  
-参考:+https://stackoverflow.com/questions/42396867/how-to-get-data-to-work-when-used-within-a-component-and-axios?rq=1
  
-参考2:+参考3:Elements in iteration expect to have 'v-bind:key' directives  vue/require-v-for-key 
 + 
 +https://tech.moiraibusiness.com/?p=153 
 + 
 +https://www.tomcky.net/entry/2018/02/27/000853
  
 作成中 作成中
 +
 +===== 少し変更したバージョン =====
 +
 +https://codesandbox.io/s/oo199w7km5
 +
 ===== Vue.jsでクイズアプリのリンク ===== ===== Vue.jsでクイズアプリのリンク =====
  


07.vue.jsでクイズアプリ/index.html.1544659886.txt.gz · 最終更新: 2018/12/13 by adash333

Donate Powered by PHP Valid HTML5 Valid CSS Driven by DokuWiki