thisパラメータがイマイチよくわからなかったのでもうちょい調べた。。 thisパラメータ function f(this: void) { } 下記のような関数の場合、呼び出し元（コンテキスト）によってthisの参照が変わる為、正しく動作しない場合がある。 const obj = { name: "…

基本的な関数 // 名前付き関数 function add(x: number, y: number): number { return x + y; } // 無名関数 let myAdd = function(x: number, y: number): number { return x + y; }; 関数の型 type FuncType = (x: number, y: number) => number; const fu…

分割代入 配列やオブジェクトの中身を別の変数へ分割して代入する仕組み 配列の分割代入 const input = [1, 2]; const [first, second] = input; console.log(first); // 1を出力 console.log(second); // 2を出力 let [first, ...rest] = [1, 2, 3, 4]; con…

交差型(Intersection Types)と共用体型(Union Types)について 交差型(Intersection Types) T & U TとUの両方を満たす型を動的に生成できる type T = { foo: string }; type U = { bar: number }; type I = T & U; // fooまたはbarのいずれかが未定義の場合は…

セットアップ yarn add axios vue-axios /main.ts import {createApp} from 'vue'; import router from './router'; import App from './App.vue'; import axios from 'axios'; import VueAxios from 'vue-axios'; createApp(App).use(router).use(VueAxios,…

下記のようなエラーが発生した Uncaught TypeError: (intermediate value)() is undefined コード: <template lang="pug"> div table tr th ID td input(type="text" v-model="model.id") tr th Password td input(type="password" v-model="model.password") tr td(colspan="2") </template>…

Providerパターンとは？ provide/inject APIを利用して、「状態やロジック」をコンポーネント間で共有する components/SimpleStore.ts import {ref, inject, provide} from 'vue'; const key = Symbol(); const createStore = () => { const count = ref(0);…

インストール yarn add -D pug pug-plain-loader yarn add -D sass node-sass sass-loader ※sassは不要かと思ったら、エラー（Preprocessor dependency "sass" not found. Did you install it?）が発生したので追加 使ってみる template、styleタグにそれぞ…

パッケージのインストール $ yarn add -D eslint prettier eslint-config-prettier eslint-plugin-vue@next セットアップ $ yarn eslint --init yarn run v1.22.5 warning package.json: No license field √ How would you like to use ESLint? · style √ Wh…

Viteとは？ ViteはVue.jsの作者のEvan You氏が作成したビルドツール。 開発時は ES モジュールをそのままインポートするため、バンドル処理が不要で高速に動作するらしい。 インストール～開発サーバの起動 yarn create @vitejs/app vite-sample --template …

①プラグインを作成する プロジェクト/src/plugins/MomentPlugin.ts import Moment from "moment"; export const MomentPlugin = { install: (_Vue: any, options: any) => { // globalPropertiesは、Vue 2.x における Vue.prototype _Vue.config.globalPrope…