diadia

興味があることをやってみる。自分のメモを残しておきます。

typescript

vue Dialogを作ってみる

ポイント: CSSの要素を使うことでダイアログを実装する事ができるってことをしっておくこと。z-indexを使えば良いことさえわかればあとはボタンの制御の問題へ置き換わる。 参考にさせていただいた資料: vue.js モーダルウィンドウ実装でコンポーネント理解…

動的コンポーネントを試してみる

動的 & 非同期コンポーネント — Vue.js 動的コンポーネントはisを使ってコンポーネントを切り替えて使う。 サンプルコード # Home.vue <template> <div class="home"> <img alt="Vue logo" src="../assets/logo.png"><br /> <button @click="onClickChangeComponent">コンポーネントを切り替える</button> </div></template>

エラー:error Type string trivially inferred from a string literal, remove type annotation @typescript-eslint/no-inferrable-types

エラー内容 error Type string trivially inferred from a string literal, remove type annotation @typescript-eslint/no-inferrable-types エラーが出たコード import { Component, Prop, Vue } from 'vue-property-decorator'; @Component({}) export de…

typescript 型の判定方法

typescriptは静的型付け言語なので、型を意識さざるを得ない。 例えばユニオン型で2つの異なるクラスを定義した場合、そのインスタンスはクラスによって使えるプロパティが変わる。 ていうことで、型を判定する条件分岐と判定する方法が重要になるらしい。 …

セッターゲッターについて

まずアクセス修飾子について アクセス修飾子はクラスを基準としてアクセスできるかどうかを定めるものと考えると良い。 class Person{ public name: string; constructor(name: string){ this.name = name; }; } let mario = Person("mario"); mario.name = …

typescriptコンパイラの設定について

udemyの超TypeScript入門 完全パック(2021)の内容をメモしている。とてもわかり易いのでおすすめ。 コンパイラの設定方法 watchモードを使って、保存時に自動的にTSからJSにコンパイルする方法 tsc --initコマンドでtsconfig.jsonを作り、すべてのファイルを…

typescriptのメモ

typescriptの特徴 Detecting errors in code without running it is referred to as static checking. Determining what’s an error and what’s not based on the kinds of values being operated on is known as static type checking. TypeScript checks a…

javascriptのasync awaitについてメモ

typescriptをやってPromiseの存在を知った。がPromiseという概念が未だに分からない。。。 少し触ってみて多少のasyc awaitを使う場合と使わない場合で何か異なることを発見したので備忘録としてメモしておく。 async await を使わない場合 private uploadIm…

javascriptで画像アップロード

mpaのdjnagoで画像をアップロードするにはフロントエンドではhtmlにinputタグ(type="file")をセットして、何らかのボタンを押してpostメソッドで送信し、views.pyにてrequest.POSTのような形で画像データを取り出してやれば画像の取り扱いはできた。 しか…

typescriptとvueの単一ファイルコンポーネントを使う

設定条件: vue.js 2系(3系だと書き方が結構違うので困難だった。) typescriptを使う 単一ファイルコンポーネントを使う。単一ファイルコンポーネントではテンプレートとスタイルタグのみを記入し、スクリプトタグは.tsファイルの読込みのみ行う。 作ってみ…

typescriptのみで構築してみた

webpackやnpmの仕組みを分かっていないので一番シンプルな構成でtypescriptを実装する方法を試してみる。 参考資料 以下を記事に従って環境を構築してみた。プロジェクト名はsssとして作成してみた。 最新版TypeScript+webpack 5の環境構築まとめ(React, Vue…

typescriptメモ

基本の型(Basic Types, Primitive Type) TypeScript: Handbook - Basic Types Boolean Number String Array Tuple Enum Unknown Any Void Null and Undefined Never Object アロー関数の戻り値の型定義について理解していない。 環境構築 書いたtypescriptを…