タグ付けされた質問 「vuejs2」

ユーザーインターフェースを構築するためのオープンソースのプログレッシブJavascriptフレームワークであるVue.jsのバージョン2に固有の質問には、このタグを使用します。

13
「小道具」の変更をリッスンする方法
でVueJs 2.0ドキュメント私が上でリッスンする任意のフック見つけることができませんprops変更を。 VueJにはそのようなフックがありonPropsUpdated()ますか? 更新 @wostexが示唆したように、私はwatch自分の財産を試しましたが、何も変わりませんでした。それから私は特別なケースがあることに気づきました: <template> <child :my-prop="myProp"></child> </template> <script> export default { props: ['myProp'] } </script> myProp親コンポーネントがコンポーネントに受け取ることを渡しchildます。その後、watch: {myProp: ...}動作していません。

10
Vue.Jsの計算されたプロパティにパラメーターを渡すことはできますか
これは、Vue.Jsの計算されたプロパティでパラメーターを渡すことが可能ですか?ゲッター/セッターが計算されたものを使用すると、パラメーターを取得して変数に割り当てることができます。ドキュメントからここのように: // ... computed: { fullName: { // getter get: function () { return this.firstName + ' ' + this.lastName }, // setter set: function (newValue) { var names = newValue.split(' ') this.firstName = names[0] this.lastName = names[names.length - 1] } } } // ... これも可能ですか? // ... computed: { …

7
Vue v-on:clickがコンポーネントで機能しない
コンポーネント内でon clickディレクティブを使用しようとしていますが、機能しないようです。コンポーネントをクリックしても、コンソールで「テストクリック」が行われるはずなのに何も起こりません。コンソールにエラーが表示されないので、何が問題なのかわかりません。 index.html <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>vuetest</title> </head> <body> <div id="app"></div> <!-- built files will be auto injected --> </body> </html> App.vue <template> <div id="app"> <test v-on:click="testFunction"></test> </div> </template> <script> import Test from './components/Test' export default { name: 'app', methods: { testFunction: function (event) { console.log('test clicked') …

24
Vue 2-ミューティングプロップvue-warn
https://laracasts.com/series/learning-vue-step-by-stepシリーズを開始しました。レッスンVue、Laravel、AJAXで次のエラーで停止しました: vue.js:2574 [Vue warn]:親コンポーネントが再レンダリングされるたびに値が上書きされるため、プロップを直接変更しないでください。代わりに、プロップの値に基づいてデータまたは計算されたプロパティを使用します。変更されるプロップ: "リスト"(コンポーネントにあります) main.jsにこのコードがあります Vue.component('task', { template: '#task-template', props: ['list'], created() { this.list = JSON.parse(this.list); } }); new Vue({ el: '.container' }) リストの小道具を上書きしたときの問題はcreated()にあることはわかっていますが、私はVueの初心者なので、修正方法はまったくわかりません。誰でもそれを修正する方法(そして理由を説明してください)を考えていますか?


17
vue.js 2 vuexからストア値を監視する方法
一緒に使っvuexてvuejs 2います。 私はに不慣れです。変数の変化vuexを見たいのstoreですが。 にwatch関数を追加したいvue component これは私がこれまでに持っているものです: import Vue from 'vue'; import { MY_STATE, } from './../../mutation-types'; export default { [MY_STATE](state, token) { state.my_state = token; }, }; に変更があるかどうか知りたい my_state store.my_statevuejsコンポーネントでどのように監視しますか?

9
親イベントで子コンポーネントの関数を呼び出す方法
環境 Vue 2.0では、ドキュメントやその他のドキュメントは、親から子への通信が小道具を介して行われることを明確に示しています。 質問 親はどのようにイベントが小道具を介して起こったことを子供に伝えますか? イベントという小道具を見ればいいですか?それは正しくありませんし、代替案もありません($emit/ $onは親から子へ、ハブモデルは遠方の要素へです)。 例 親コンテナがあり、APIで特定のアクションを実行しても問題がないことを子コンテナに通知する必要があります。関数をトリガーできるようにする必要があります。

2
名前空間を持つ2つのvuexモジュール間でアクションをディスパッチする方法はありますか?
名前空間を持つモジュール間でアクションをディスパッチすることは可能ですか? たとえば、vuexモジュール「gameboard」と「notification」があります。それぞれに名前空間があります。ゲームボードから通知モジュールにアクションをディスパッチしたいのですが。 次のように、モジュール名をディスパッチアクション名に使用できると思いました。 // store/modules/gameboard.js const actions = { myaction ({dispatch}) { ... dispatch('notification/triggerSelfDismissingNotifcation', {...}) } } // store/modules/notification.js const actions = { triggerSelfDismissingNotification (context, payload) { ... } } しかし、これを実行しようとすると、vuexがゲームボードモジュール内でアクションをディスパッチしようとしているというエラーが発生します。 [vuex]不明なローカルアクションタイプ:notification / triggerSelfDismissingNotification、グローバルタイプ:gameboard / notification / triggerSelfDismissingNotification vuexモジュールからモジュールにディスパッチする方法はありますか、またはルートvuexインスタンスにある種のブリッジを作成する必要がありますか?
159 vue.js  vuejs2  vuex 

12
外部JSスクリプトをVueJSコンポーネントに追加する方法
支払いゲートウェイには2つの外部スクリプトを使用する必要があります。現在、両方がindex.htmlファイルに入れられています。ただし、これらのファイルを最初にロードしたくありません。支払いゲートウェイは、ユーザーが特定のコンポーネントを開いたときにのみ必要です(using router-view)。 とにかくこれを達成する方法はありますか?

13
Vue2でデバウンスを実装する方法は?
Vueテンプレートに単純な入力ボックスがあり、多かれ少なかれこのようにデバウンスを使用したいと思います。 <input type="text" v-model="filterKey" debounce="500"> ただし、このdebounceプロパティはVue 2では廃止されました。推奨事項には、「v-on:input +サードパーティのデバウンス機能を使用する」とのみ記載されています。 どのように正しく実装しますか? lodash、v-on:input、v-modelを使用して実装しようとしましたが、追加の変数なしで実行できるかどうか疑問に思っています。 テンプレート: <input type="text" v-on:input="debounceInput" v-model="searchInput"> スクリプトで: data: function () { return { searchInput: '', filterKey: '' } }, methods: { debounceInput: _.debounce(function () { this.filterKey = this.searchInput; }, 500) } フィルターキーは、後でcomputed小道具で使用されます。

6
Vuejs:ルート変更時のイベント
私のメインページにはv-show=show、リンク@click = "show=!show"をクリックして表示されるドロップダウンがあり、show=falseルートを変更するときに設定します。このことを実現する方法を教えてください。


15
Vueアプリをデプロイする方法は?
Vueアプリを開発した後はどうすればよいvue-cliですか? で角度 1つのスクリプトにすべてのスクリプトをバンドルし、いくつかのコマンドがあった、その後、これらのファイルをホストに送信されます。 Vueに同じものはありますか?
131 vue.js  vuejs2  vue-cli 

4
Vueプロジェクトのビューとコンポーネントフォルダーの違いは何ですか?
コマンドライン(CLI)を使用してVue.jsプロジェクトを初期化しました。CLI作成src/componentsし、src/viewsフォルダを。 Vueプロジェクトで作業してから数か月が経ちましたが、フォルダー構造は初めてのようです。 で生成されたVueプロジェクトのviewsとcomponentsフォルダーの違いは何vue-cliですか?

3
Vuex-複数のパラメーターをミューテーションに渡す
vuejsとlaravelのパスポートを使用してユーザーを認証しようとしています。アクションを介してvuexミューテーションに複数のパラメーターを送信する方法を理解できません。 - お店 - export default new Vuex.Store({ state: { isAuth: !!localStorage.getItem('token') }, getters: { isLoggedIn(state) { return state.isAuth } }, mutations: { authenticate(token, expiration) { localStorage.setItem('token', token) localStorage.setItem('expiration', expiration) } }, actions: { authenticate: ({ commit }, token, expiration) => commit('authenticate', token, expiration) } }) -ログイン方法- login() { var …
124 vue.js  vuejs2  vuex 

弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.