タグ付けされた質問 「vue.js」

Vueをインストールし、いくつかのチュートリアルに従って、vue-cli webpackテンプレートを使用してプロジェクトを作成しました。コンポーネントを作成すると、次の内部でデータがバインドされていることに気づきました。 export default { name: 'app', data: [] } 一方、他のチュートリアルでは、データがバインドされているのがわかります。 new Vue({ el: '#app', data: [] )} 違いは何ですか、なぜ2つの構文が異なるように見えるのですか？vue-cliによって生成されたApp.vueから使用しているタグの内側から「新しいVue」コードを機能させるのに問題があります。

136 vue.js  vue-component  vue-cli 

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

134 vue.js  vuejs2  vue-router 

Vue.jsバニラのjavascriptのようにリダイレクトを作成したい window.location.href = 'some_url' Vue.jsでこれを実現するにはどうすればよいですか？

133 vue.js  url-routing  vuejs2  vue-router 

私の行動には次の設定があります。 get1: ({commit}) => { //things this.get2(); //this is my question! }, get2: ({commit}) => { //things }, あるアクションを別のアクションから呼び出すことができるようにしたいので、この例ではget2()、内から呼び出すことができるようにしますget1()。これは可能ですか？可能な場合、どうすればできますか？

133 vue.js  vuex 

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

131 vue.js  vuejs2  vue-cli 

私は最近、jQからより構造化されたフレームワークであるVueJSへの移行を開始しました。 概念的には、Vuexは私にとって少しパラダイムシフトでしたが、私は今、そのすべてが何であるかを知っており、それを完全に理解していると確信しています！しかし、ほとんどが実装の観点から、いくつかの小さな灰色の領域が存在します。 これは設計上は良いと感じますが、単方向データフローのVuex サイクルと矛盾するかどうかはわかりません。 基本的に、アクションからpromise（like）オブジェクトを返すことは良い習慣と考えられていますか？私はこれらを非同期状態のラッパーとして扱い、障害などの状態があるので、promiseを返すのに適しているようです。逆にミューテーターは物事を変えるだけで、ストア/モジュール内の純粋な構造です。

130 promise  vue.js  es6-promise  state-management  vuex 

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

128 vue.js  vuejs2  vue-cli  vue-cli-3  vue-cli-4 

次のようにして日付時刻を印刷してみます vue-for {{ moment().format('MMMM Do YYYY, h:mm:ss a') }} ただし、表示されません。それはただの空白です。Vueでモーメントを使用する方法を教えてください。

127 momentjs  vue.js 

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 

CLI（v3.7.0）を使用して新しいプロジェクトを作成する場合dart-sass、node-sassコンパイラーを選択するオプションがあります。 Vueのドキュメントで宣言されているよりも具体的に、これらは互いにどのように比較されますか？ Sassパフォーマンスに関するヒント Dart Sassを使用する場合、非同期コールバックのオーバーヘッドのため、同期コンパイルはデフォルトで非同期コンパイルの2倍の速度であることに注意してください。このオーバーヘッドを回避するために、ファイバーパッケージを使用して、同期コードパスから非同期インポーターを呼び出すことができます。これを有効にするには、プロジェクトの依存関係としてファイバーをインストールするだけです。 npm install -D fibers また、ネイティブモジュールであるため、OSやビルド環境によって互換性の問題が異なる場合があることにも注意してください。その場合は、実行npm uninstall -D fibersして問題を解決してください。 ? Pick a CSS pre-processor (PostCSS, Autoprefixer and CSS Modules are supported by default): (Use arrow keys) ❯ Sass/SCSS (with dart-sass) Sass/SCSS (with node-sass) Less Stylus 編集2020/01： Vue CLI 4.2.2新しいプロジェクトの作成はdart-sass、前の最初のオプションとしてまだ提案されていますnode-sass。それでもnode-sass、よりパフォーマンスの高い選択肢であることがここで確立されており、ダーツサスを使用する人はほとんどいません（ccleveのコメント）。 EDIT 2020/09：としてアリBahramiは彼の豊富な答えを更新し、dart-sass好ましい選択肢であるとしてnode-sass廃止予定としてマークされています。 dart-sassJSでコンパイルされたバージョンはパフォーマンスが悪いので残念です。ただし、開発者はこれを十分に認識しており、この号で述べられているように、パフォーマンスの向上に取り組んでいます。

121 vue.js  webpack  sass  vue-cli  node-sass 

VueJSでは、v-ifを使用してDOM要素を追加または削除できます。 <button v-if="isRequired">Important Button</button> しかし、dom要素の属性を追加/削除する方法はあります。たとえば、次の場合、必要な属性を条件付きで設定します。 Username: <input type="text" name="username" required> 次のようなもので： Username: <input type="text" name="username" v-if="name.required" required> 何か案は？

119 javascript  vue.js  vuejs2 

要素の外側のクリックを検出するにはどうすればよいですか？私はVue.jsを使用しているので、それは私のテンプレート要素の外にあります。私はバニラJSでそれを行う方法を知っていますが、私がVue.jsを使用しているときにそれを行うためのより適切な方法があるかどうかはわかりませんか？ これはバニラJSのソリューションです： divの外部のJavascript Detect Clickイベント 要素にアクセスするためのより良い方法を使用できると思いますか？

118 javascript  vue.js 

コンポーネントがありますが、その要素の1つを選択するにはどうすればよいですか？ このコンポーネントのテンプレート内にある入力を取得しようとしています。 複数のコンポーネントが存在する可能性があるため、queryselectorはコンポーネントの現在のインスタンスのみを解析する必要があります。 Vue.component('somecomponent', { template: '#somecomponent', props: [...], ... created: function() { somevariablehere.querySelector('input').focus(); } }); 前もって感謝します

116 javascript  vue.js 

ラベルと入力を含むVue.jsでコンポーネントを作成したいと思います。例えば ​​： <label for="inputId">Label text</label> <input id="inputId" type="text" /> 各コンポーネントインスタンスに一意のIDを設定するにはどうすればよいですか？ ありがとうございました。

115 vue.js 

入力フィールドを変更するときにVue-routerでクエリパラメータを設定しようとしています。他のページに移動したくないが、同じページのURLクエリパラメータを変更したいだけです。次のようにしています。 this.$router.replace({ query: { q1: "q1" } }) ただし、これによってページが更新され、y位置が0に設定されます。つまり、ページの上部にスクロールします。これは、URLクエリパラメータを設定する正しい方法ですか、それともより適切な方法ですか。 編集： これが私のルーターコードです： export default new Router({ mode: 'history', scrollBehavior: (to, from, savedPosition) => { if (to.hash) { return {selector: to.hash} } else { return {x: 0, y: 0} } }, routes: [ ....... { path: '/user/:id', component: UserView }, ] })

114 javascript  vue-router  vue.js