คำถามติดแท็ก vue.js

ฉันเพิ่งติดตั้ง Vue และทำตามแบบฝึกหัดเพื่อสร้างโครงการโดยใช้เทมเพลต vue-cli webpack เมื่อสร้างส่วนประกอบฉันสังเกตเห็นว่ามันผูกข้อมูลของเราไว้ภายในสิ่งต่อไปนี้: export default { name: 'app', data: [] } ในขณะที่บทช่วยสอนอื่น ๆ ฉันเห็นว่าข้อมูลถูกผูกไว้จาก: new Vue({ el: '#app', data: [] )} อะไรคือความแตกต่างและทำไมดูเหมือนว่าไวยากรณ์ระหว่างทั้งสองแตกต่างกัน? ฉันมีปัญหาในการทำให้โค้ด 'new Vue' ทำงานจากภายในแท็กที่ฉันใช้จาก App.vue ที่สร้างโดย vue-cli

137 vue.js  vue-component  vue-cli 

ฉันมีการตั้งค่าต่อไปนี้สำหรับการกระทำของฉัน: get1: ({commit}) => { //things this.get2(); //this is my question! }, get2: ({commit}) => { //things }, ฉันต้องการเรียกการกระทำหนึ่งจากภายในอีกรายการหนึ่งดังนั้นในตัวอย่างนี้ฉันต้องการสามารถเรียกget2()จากภายในget1()ได้ เป็นไปได้หรือไม่และถ้าเป็นเช่นนั้นฉันจะทำได้อย่างไร

136 vue.js  vuex 

ในหน้าหลักของฉันฉันมีดรอปดาวน์ที่แสดงv-show=showโดยคลิกที่ลิงค์@click = "show=!show"และฉันต้องการตั้งค่าshow=falseเมื่อฉันเปลี่ยนเส้นทาง โปรดแนะนำฉันว่าจะตระหนักถึงสิ่งนี้ได้อย่างไร

134 vue.js  vuejs2  vue-router 

ฉันต้องการเปลี่ยนเส้นทางVue.jsให้คล้ายกับจาวาสคริปต์วานิลลา window.location.href = 'some_url' ฉันจะบรรลุสิ่งนี้ใน Vue.js ได้อย่างไร

134 vue.js  url-routing  vuejs2  vue-router 

ฉันควรทำอย่างไรหลังจากพัฒนาแอปVueด้วยvue-cli? ในAngularมีคำสั่งบางอย่างที่รวมสคริปต์ทั้งหมดไว้ในสคริปต์เดียวจากนั้นไฟล์เหล่านี้จะถูกส่งไปยังโฮสต์ มีบางอย่างที่เหมือนกันในVueหรือไม่?

133 vue.js  vuejs2  vue-cli 

ฉันเพิ่งเริ่มโยกย้ายสิ่งต่างๆจาก jQ ไปยังเฟรมเวิร์กที่มีโครงสร้างมากกว่าคือ VueJS และฉันก็ชอบมัน! ตามแนวคิดแล้ว Vuex เป็นการปรับเปลี่ยนกระบวนทัศน์เล็กน้อยสำหรับฉัน แต่ฉันมั่นใจว่าฉันรู้ว่าตอนนี้มันเป็นอย่างไรและเข้าใจทั้งหมด! แต่มีพื้นที่สีเทาเล็กน้อยส่วนใหญ่มาจากมุมมองของการนำไปใช้งาน อันนี้ฉันรู้สึกว่าดีจากการออกแบบ แต่ไม่รู้ว่ามันขัดแย้งกับวัฏจักร Vuex ของการไหลของข้อมูลแบบทิศทางเดียวหรือไม่ โดยพื้นฐานแล้วถือเป็นแนวทางปฏิบัติที่ดีในการคืนสัญญา (- เหมือน) วัตถุจากการกระทำหรือไม่? ฉันถือว่าสิ่งเหล่านี้เป็นเหมือน async wrappers ด้วยสถานะของความล้มเหลวและสิ่งที่คล้ายกันดังนั้นดูเหมือนว่าจะเหมาะสมที่จะคืนสัญญา ผู้กลายพันธุ์ในทางตรงกันข้ามจะเปลี่ยนสิ่งต่าง ๆ และเป็นโครงสร้างที่บริสุทธิ์ภายในร้านค้า / โมดูล

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

ฉันพยายามพิมพ์วันเวลาโดยใช้ดังต่อไปนี้ใน vue-for {{ moment().format('MMMM Do YYYY, h:mm:ss a') }} แต่มันไม่ปรากฏ มันเป็นเพียงความว่างเปล่า ฉันจะลองใช้ช่วงเวลาใน vue ได้อย่างไร

130 momentjs  vue.js 

ฉันเพิ่งใช้บรรทัดคำสั่ง ( CLI) เพื่อเริ่มต้นโครงการ Vue.js CLIสร้างsrc/componentsและsrc/viewsโฟลเดอร์ เป็นเวลาสองสามเดือนแล้วที่ฉันทำงานกับโครงการ Vue และโครงสร้างโฟลเดอร์ดูเหมือนจะใหม่สำหรับฉัน อะไรคือความแตกต่างระหว่างviewsและcomponentsโฟลเดอร์ในโครงการ Vue ที่สร้างขึ้นด้วยvue-cli?

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

ฉันพยายามตรวจสอบสิทธิ์ผู้ใช้โดยใช้หนังสือเดินทางของ 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) …

126 vue.js  vuejs2  vuex 

เมื่อสร้างโครงการใหม่ด้วย CLI (v3.7.0) มีตัวเลือกให้เลือกระหว่างdart-sassหรือnode-sassคอมไพเลอร์ เหล่านี้จะเปรียบเทียบวิธีการแต่ละอื่น ๆ ที่จะเฉพาะเจาะจงมากขึ้นกว่าที่ประกาศไว้ในเอกสาร Vue ? เคล็ดลับเกี่ยวกับประสิทธิภาพของ Sass โปรดทราบว่าเมื่อใช้ Dart Sass การคอมไพล์แบบซิงโครนัสจะเร็วกว่าการคอมไพล์แบบอะซิงโครนัสเป็นสองเท่าโดยค่าเริ่มต้นเนื่องจากค่าใช้จ่ายของการเรียกกลับแบบอะซิงโครนัส เพื่อหลีกเลี่ยงค่าใช้จ่ายนี้คุณสามารถใช้แพ็คเกจ fibre เพื่อเรียกผู้นำเข้าแบบอะซิงโครนัสจากเส้นทางรหัสซิงโครนัส ในการเปิดใช้งานสิ่งนี้เพียงแค่ติดตั้งเส้นใยเป็นการพึ่งพาโครงการ: npm install -D fibers โปรดทราบด้วยว่าเป็นโมดูลดั้งเดิมอาจมีปัญหาความเข้ากันได้ที่แตกต่างกันไปตามระบบปฏิบัติการและสภาพแวดล้อมการสร้าง ในกรณีนี้โปรดเรียกใช้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 …

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

ฉันจะตรวจจับการคลิกนอกองค์ประกอบของฉันได้อย่างไร ฉันใช้ Vue.js ดังนั้นมันจะอยู่นอกองค์ประกอบเทมเพลตของฉัน ฉันรู้วิธีทำใน Vanilla JS แต่ฉันไม่แน่ใจว่ามีวิธีที่เหมาะสมกว่านี้หรือไม่เมื่อฉันใช้ Vue.js? นี่เป็นวิธีแก้ปัญหาสำหรับเหตุการณ์ Vanilla JS: Javascript Detect Click ภายนอก div ฉันเดาว่าฉันสามารถใช้วิธีที่ดีกว่าในการเข้าถึงองค์ประกอบได้หรือไม่?

121 javascript  vue.js 

ฉันอ่านเอกสาร แต่ไม่เข้าใจ ฉันรู้ว่าข้อมูลใดคำนวณดูวิธีการทำ แต่สิ่งที่nextTick()ใช้สำหรับ vuejs?

121 vue.js  vuejs2 

ใน VueJS เราสามารถเพิ่มหรือลบองค์ประกอบ DOM โดยใช้ v-if: <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 

ฉันมีส่วนประกอบที่มีการตรวจสอบความถูกต้องของรูปแบบบางอย่าง เป็นแบบฟอร์มการชำระเงินหลายขั้นตอน โค้ดด้านล่างนี้ใช้สำหรับขั้นตอนแรก ฉันต้องการตรวจสอบว่าผู้ใช้ป้อนข้อความบางส่วนเก็บชื่อไว้ในสถานะส่วนกลางแล้วส่งไปยังขั้นตอนถัดไป ฉันใช้vee-validateและ vuex <template> <div> <div class='field'> <label class='label' for='name'>Name</label> <div class="control has-icons-right"> <input name="name" v-model="name" v-validate="'required|alpha'" :class="{'input': true, 'is-danger': errors.has('name') }" type="text" placeholder="First and Last"> <span class="icon is-small is-right" v-if="errors.has('name')"> <i class="fa fa-warning"></i> </span> </div> <p class="help is-danger" v-show="errors.has('name')">{{ errors.first('name') }}</p> </div> <div class="field pull-right"> <button …

118 vue.js  vuejs2  vue-component  vuex 

ฉันมีองค์ประกอบฉันจะเลือกองค์ประกอบใดองค์ประกอบหนึ่งได้อย่างไร ฉันกำลังพยายามรับอินพุตที่อยู่ในเทมเพลตของคอมโพเนนต์นี้ อาจมีหลายองค์ประกอบดังนั้นตัวเลือกแบบสอบถามต้องแยกวิเคราะห์อินสแตนซ์ปัจจุบันของคอมโพเนนต์เท่านั้น Vue.component('somecomponent', { template: '#somecomponent', props: [...], ... created: function() { somevariablehere.querySelector('input').focus(); } }); ขอบคุณล่วงหน้า

117 javascript  vue.js