シニアがプログラミング勉強のために作ったもの 001

スポンサーリンク

toDo_List (Vue.js)

Dotinstallを参考に作りました。

  Vue.js入門 (全17回) – プログラミングならドットインストール

変更したところは、Bootstrap4を使用しました。
バグたくさんあると思いますの指摘してください。

  toDo_List (Vue.js)

履歴:

  1.  2019-11-16 Up
  2.  2019-11-23 編集機能追加、機能ボタン一箇所にする(up/down 未実装)
  3.  2019-11-24 編集結果が保存されないバグ修正
  4.  2019-11-29 データの移動ができるようにしました。

Vue.jsで悩んだこと

(1)とにかく this. が大事。うごかなかったらつけてみる

(2)配列の更新は、splice(index,1,data) でないとダメみたい

参考サイト:  Vue.jsでToDoリストを作成するためにリストレンダリングを学ぶ

  リストレンダリング — Vue.js

 

Vue.jsで配列の入れ替え(spliceを使うとできました)

 upMove: function(index){
    if (index !== 0){
         this.todos.splice(index-1, 2, this.todos[index], this.todos[index-1]);
    }         
 },
 downMove: function(index){
    if (index !== this.todos.length-1){
          this.todos.splice(index, 2, this.todos[index+1], this.todos[index]);
    }
 }

 

神経衰弱カード (アルファベット)

 

   神経衰弱アルファベット

href=”#” と a href=”” の違い

a href=”#” :  ページのTOPに
a href=””   :  ページをリロードする

 

コメント

タイトルとURLをコピーしました