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

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

ユーザ用ツール

サイト用ツール


00.ionic4:11.緯度経度から歩いた距離を表示


差分

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

この比較画面へのリンク

両方とも前のリビジョン前のリビジョン
次のリビジョン
前のリビジョン
00.ionic4:11.緯度経度から歩いた距離を表示 [2019/09/11] – [Vue.jsとsetInterval] adash33300.ionic4:11.緯度経度から歩いた距離を表示 [2019/09/12] (現在) – [いまどきのJavaScript記法] adash333
行 107: 行 107:
  
 ===== Vue.jsとsetInterval ===== ===== Vue.jsとsetInterval =====
- +これからはじめるVue.js実践入門p37によると、setIntervalメソッドの配下では、thisは、Vueインスタンスではなく、グローバルオブジェクト(window)に変化してしまうため、あらかじめthatなどで固定しておく必要があるとのことです
-setIntervalメソッドの配下では、thisは、Vueインスタンスではなく、グローバルオブジェクト(window)に変化してしまうため、あらかじめthatなどで固定しておく必要がある。+
  
 <code> <code>
 export default { export default {
-  name: +  name: 'HelloWorld', 
 +  data: { 
 +  // 現在日時 
 +    current: new Date() 
 +  }, 
 +  // 起動時にタイマーを設定 
 +  created: function() { 
 +    let that = this; 
 +    // 1000ミリ秒スパンでcurrentプロパティを更新 
 +    this.timer = setInterval(function() { 
 +      that.current = new Date(); 
 +    }, 1000); 
 +  }, 
 +  // 終了時にタイマーを破棄 
 +  beforeDestroy: function() { 
 +    clearInterval(this.timer); 
 +  },   
 +  methods: { 
 +     
 +  }
  
 } }
行 124: 行 142:
 </html> </html>
  
 +===== Javascriptのthisについて =====
  
 +https://www.sejuku.net/blog/29389
 +thisって何?使い方を覚えて、JavaScriptをもっと楽しく使おう!
 +マサト
 +2019/5/11
 +
 +https://qiita.com/tsukishimaao/items/39d22fd9178546d6cdeb
 +@tsukishimaao
 +2014年02月01日に更新
 +windowオブジェクト
 +
 +(引用ここから)
 +windowオブジェクトとはJavaScriptにあらかじめ用意されてるオブジェクトで、JavaScriptを何も書いてない状態でもwindowオブジェクトは利用する事が出来る。
 +JavaScriptであらかじめ用意されている関数やオブジェクトは、みなwindowオブジェクトのプロパティです。HTMLデータを取得、操作する為の
 +window.document、URLなどの情報が格納されているwindow.locationなども、すべてwindowオブジェクトのプロパティです。
 +(引用ここまで)
 +
 +https://qiita.com/takeharu/items/9935ce476a17d6258e27
 +@takeharu
 +2015年12月07日に更新
 +JavaScriptの「this」は「4種類」??
 +
 +https://stackoverflow.com/questions/20279484/how-to-access-the-correct-this-inside-a-callback
 +How to access the correct `this` inside a callback?
 +
 +https://stackoverflow.com/questions/43335477/how-to-use-setinterval-in-vue-component
 +how to use setInterval in vue component
 +
 +"this"の問題らしい、、、
 +
 +Using object methods as callbacks/event handlers
 +what this refers to depends on how the function is called, not how it is defined.
 +そのため、解決策としては、
 +  -''%%.bind()%%''を用いる
 +  -''%%let self = this%%''としてthisオブジェクトを別の変数に割り当てる
 +  -アロー関数を用いる
 +の3つがあるそうです。''%%let self = this%%''としてthisオブジェクトを別の変数に割り当てる方法が、一番分かりやすそうです。
  
  
行 132: 行 187:
 Written by Jonnie Hallman Written by Jonnie Hallman
 @destroytoday @destroytoday
 +
 +===== いまどきのJavaScript記法 =====
 +
 +https://qiita.com/shibukawa/items/19ab5c381bbb2e09d0d9
 +@shibukawa
 +2019年05月04日に更新
 +イマドキのJavaScriptの書き方2018
 +
 +===== Vue.jsでlocalStorage =====
 +
 +
 +https://jp.vuejs.org/v2/cookbook/client-side-storage.html
 +クライアントサイドストレージ
 +最終更新日: 2019年9月10日
 +
 +https://qiita.com/ma7ma7pipipi/items/4dac390043efc24b0732
 +@ma7ma7pipipi
 +2019年01月14日に投稿
 +vue.js で json localstorage を使う
 +
 +https://iwb.jp/javascript-vuejs-install-localstorage/
 +2019年6月10日
 +Vue.jsでinstallを使用せずにlocalStorageを使用する方法
 +
 +
 +
 +
 +
  
  


00.ionic4/11.緯度経度から歩いた距離を表示.1568174077.txt.gz · 最終更新: 2019/09/11 by adash333

Donate Powered by PHP Valid HTML5 Valid CSS Driven by DokuWiki