【Vue.js入門】v-on、v-forを使ってみよう！ - Qiita
Vue.jsの入門で必ず出てくるv-onとv-for v-onとv-forを使うことができれば以下のようなToDoアプリもすぐ作れました！ 今回のつまづきいたところ addボタンを押してもページがリロードされる フォームに打ち込んだ文字が消えない それではVue.jsだけで簡単なToDoアプリを作っていきましょう！ まずは雛形をつくる まずはJavaScript側。 【初心者向け】Vue.jsの双方向データバインディングと同じ作りをしているため、説明は簡単に書きます。 main.js (function(){ "use strict"; var vm = new Vue({ el: '#app', data: { todos: [ 'task1', 'task2', 'task3' ] } }); })(); new Vueで新規作成したインスタンスを変数vmに与えます。 HTML側の"i
Nuxt.jsでサーバーサイドからAPIアクセスして表示を行う - Qiita
<template> <div id="app"> <h1>Nuxt API Test</h1> <div class="itemContainer"> <Item v-for="(result, index) in items" :key="index" v-bind:id="result.id" v-bind:name="result.name" v-bind:value="result.value" > </Item> </div> </div> </template> <script> import Item from '~/components/Item.vue' import axios from 'axios' export default { components: { Item }, head: { title: 'Nuxt API Test' }, asyncData
Vue.jsでv-forをネストする - Qiita
v-forをnestするために おつかれさまです。先日のVue.js meetup#6はお疲れ様でした。ピンクの髪色のイケメンさんすごく楽しかったです。 記事に間違いがあればPRでもください〜〜〜！！！ Vue.js アドベントカレンダー2 15日目の記事です。 https://qiita.com/advent-calendar/2017/vue2 やりたいこと <div v-for> <div v-for> <div v-for> v-forをネストしてデータをすべて出力したい。 </div> </div> </div> 今回扱うデータ ブログのカテゴリごとに記事を出力する。 データ：カテゴリ(数：0以上)ごとにブログ(数：0~3)をもたせています。 ブログにはタイトルと画像URLを持たせています。 v-forをnestするには同じ名前を使うだけ 同じ変数名を使ってやればデータにアクセス
リストレンダリング — Vue.js
v-for で配列に要素をマッピングする配列に基づいて、アイテムのリストを描画するために、v-for ディレクティブを使用することができます。v-for ディレクティブは item in items の形式で特別な構文を要求し、items はソースデータの配列で、item は配列要素がその上で反復されているエイリアスです: <ul id="example-1"> <li v-for="item in items" :key="item.message"> {{ item.message }} </li> </ul> var example1 = new Vue({ el: '#example-1', data: { items: [ { message: 'Foo' }, { message: 'Bar' } ] } }) 結果: {{item.message}} v-for ブロック内で
Nuxt.js で簡単な画像一覧アプリを作成する - Part.1 | LuftGarden
Nuxt.js とは Nuxt.js は「ユニバーサルな Vue.js アプリケーションを構築するためのフレームワーク」です。 ユニバーサルという言葉を辞書で引くと、「すべてに共通であること」、「普遍的・一般的」という意味になります。 ここで言う「ユニバーサル」とは、「サーバサイドとクライアントサイドの違いを抽象化することで無視して、一貫した方法でUIレンダリングすること」です。 公式ドキュメント を見れば最も理解が進むと思います。 Nuxt.js はコンポーネントとルートをマッピングするための vue-router や、Vue.jsで状態管理するためのライブラリである Vuex を内包しています。 Nuxt.jsの利用シーンについて Nuxt.jsの主な機能は以下のようになっています（公式ドキュメントより引用）。 Vue ファイルで記述できること コードを自動的に分割すること サーバ
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
hackernews/_id.vue at master · nuxt/hackernews
