環境 ESLint 8.0.1 Vue 3.2.20 対策 ESLintの設定ファイルに、グローバル変数として定義する。 $ cat .eslintrc { "globals": { "defineProps": "readonly", "defineEmits": "readonly", "defineExpose": "readonly", "withDefaults": "readonly" } } 参考 U…

高速と噂のBetaがとれたViteで、BackendがRuby(Rack)なVueアプリケーションを開発できたら、最高かもしれない。 ということで調べてみると、Vite Rubyなるものがあったので動かしてみました。 参考 Getting Started | Vite Ruby 手順 事前準備 Node.jsのバー…

とりあえずのメモ書きです。 環境 Rails 5.2.1 Vue 2.5.17 ESLint 5.6.0 RubyMine 2018.2 単体テストフレームワークをセットアップする 以下を参考に、Jest（単体テストフレームワーク）をセットアップ。 RailsのVue.jsをWebpackerとJestでテストする（翻訳…

目的 こうしたい。 <script> import axios from 'axios' export default { data: function() { … </script> しかし、改行によって自動的にインデントされてしまう。 <script> import axios from 'axios' export default { data: function() { … </script> むむむ、、 環境 RubyMine 2018.2 対策…

方法 v-data-tableにpagination.syncプロパティを指定する。 pagination.syncプロパティを設定する。（sortByにソート対象のヘッダのvalueを指定する） <template> <v-data-table :headers="headers" :items="items" :pagination.sync="pagination" hide-actions > </v-data-table> </template> <script> export default { data: function() { return { // 略…

環境 vue 2.4.3 現象 親コンポーネントから子コンポーネントにプロパティを渡した際に、バリデーションに引っかかる。 // console [Vue warn]: Invalid prop: type check failed for prop "value". Expected Number, got String. // parent.js <template> <div> <slider value="50"></slider> </div> </template> <script> import …

目的 router-link元のコンポーネントに共通処理を作成しておいて、router-linkしたコンポーネントから、emitで呼び出せるようにしたい。 環境 vue 2.4.3 vue-router 3.0.1 結論 router-viewにイベントをアタッチ(v-on)すればOK。 例 router-link元のコンポー…