gigabyte

vue.js를 사용하여 동적 클래스 이름 추가 Vue.js를 사용하여 맞춤형 플래시 메시지를 만들었습니다.이것은 정상적으로 동작하고 있습니다만, 다음의 순서에서는, 다이나믹 클래스를 컴포넌트에 추가할 수 있습니다. Flash.vue {{ message }} {{ styleClass }} 이렇게 추가하려고 하면 다음 오류가 나타납니다. - invalid expression: Unexpected token { in flash-container {{ styleClass }} Raw expression: v-bind:class="flash-container {{ styleClass }}" 내가 뭘 놓쳤지?이 설정으로 변경하면 다음과 같이 동작합니다. :class="[styleClass, 'flash-contai..

Vue 3 - app.config가 정의되지 않았습니다.이 오류를 회피하는 방법 모든 걸 문서대로 하고 있는데 콘솔에 오류가 있어요.Firebase 인스턴스의 글로벌 변수를 생성하려고 합니다. main.js: import { createApp } from "vue"; import App from "./App.vue"; import router from "./router"; import store from "./store"; import firebase from 'firebase' require('firebase/firestore') const config = { // config } firebase.initializeApp(config) const app = createApp(App) .use(store..

벤더의 규모를 초과 안녕하세요, 크기를 변경하거나 벤더를 분할할 수 없었습니다.서버를 로드하지 않는 이유와 몇 초 후에 종료합니다. 문제는 nuxt auth를 도입하려고 하는데 서버가 이것을 돌려줬다는 것입니다.단말기 응답은 아래와 같습니다. 이전에는 모든 것이 정상적으로 동작했지만, 예상외로 로딩하고 싶지 않았고, 몇 초 후에 이 앱을 실행하려고 할 때마다 서버가 종료되었습니다. 또, 서버가 정상적으로 동작하기 전에 코드의 일부를 삭제한 후에도, 혹은 새로운 프로젝트 벤더를 작성한 후에도, 이 에러는 계속 발생하고 있습니다만, 파일을 추가해 사이즈를 조금 넘을 때까지 모든 것이 동작합니다. 이 문제가 벤더의 사이즈와 관련되어 있다는 것을 알고 nuxt.config.js의 빌드를 변경하여 청크의 크기를 ..

계산된 속성 업데이트 후 함수를 실행하는 가장 좋은 방법 현재 Vuex 스토어에서 업데이트하는 계산된 속성을 가진 구성 요소가 있습니다.이 부분은 완벽하게 작동한다.제가 혼란스러운 것은 일단 계산된 속성 업데이트가 이루어지면, 저는 항상 제 뷰에 맞게 데이터를 조정해야 한다는 것입니다.이것을 달성하는 가장 좋은 방법은 무엇입니까? 예를 들어 다음과 같습니다. 내 컴포넌트는 다음과 같습니다. computed: { players: function() { return this.$store.state.players; }, 나는 이전에 기능이 있었다.setupPlayers(data)이 정보를 수정하여 뷰에 제공했습니다. 지금 궁금한 것은 컴퓨터 플레이어가 변경되면 뷰에 맞게 데이터를 조정하는 기능을 실행하고 싶다..

VueX에 여러 Axios 요청을 저장하는 가장 좋은 방법은 무엇입니까? Vue는 처음이라 여러 요청에서 데이터를 가져와 개체에 저장한 다음 데이터에 대한 몇 가지 조작을 미리 작성하는 방법을 알고 싶습니다.(형식 날짜, 통화 속성 추가 등) 예를 들어 다음과 같습니다. 예를 들어 다음과 같이 하겠습니다. https://jsonplaceholder.typicode.com/posts/1' https://jsonplaceholder.typicode.com/posts/2' https://jsonplaceholder.typicode.com/posts/3' 그래서 저는 다음과 같은 것을 하고 싶습니다. 나중에 루프할 수 있도록 모든 ID를 저장하도록 상태 변수 설정 state: { ids:[1,2,3], post..

nuxtjs의 미들웨어 이름 지정 getter 기능에 액세스합니다. getter가 있는 스토어 모듈에는 store/auth.js라는 이름의 스토어 모듈이 있습니다. export const getters = { isAuthenticated(state) { return state.token != null } } 미들웨어에서는 이 이름을 getter라고 부릅니다.그 개터를 어떻게 불러야 하죠? 이것은 효과가 있는 것처럼 보이지만, 아무것도 네임스페이스 없이... export default function (context) { if(!context.store.getters.isAuthenticated) context.redirect('/') } } Getters가 호출해야 하는 동작이나 변환과 다른 동작을 합니..

vuex에서의 mapState, mapGetters, mapActions, mapMetations의 차이점 몇 달 동안 vue/vuex를 사용했는데 알 수 있습니다.mapState,mapGetters,mapActions,mapMutations하지만 그들이 하는 일은mapState. 이렇게 쓰고 있어요.mapState // mutations.js user: { address: {}, name: '', age: '' } 제 코드에는 다음과 같은 것이 있습니다. import { mapState } from 'vuex' export default { data: {}, computed: { ...mapState({ address: state => state.user.address }) } } 주소는 어디서든 쓸 ..

현재 페이지의 Vuex 레코드를 삭제할 때 네비게이션을 처리하는 방법 나는 가지고 있다ClientManagePage여기서 클라이언트 정보를 표시하고 표시된 클라이언트를 삭제할 수 있습니다. 이 페이지의 vue-router 루트 설정은 다음과 같습니다. { path: '/client/:id/manage', name: 'client', component: ClientManagePage, props: ({ params }) => ({ id: params.id }), } 클라이언트 엔티티는 vuex 저장소에 저장됩니다. ClientManagePage를 사용하여 스토어에서 클라이언트엔티티를 가져옵니다.id클라이언트의 다양한 속성 및 "삭제" 버튼을 표시합니다. 제거 버튼 청취자는 (내부)mapActions): a..

네이티브 스크립트는 vuex 요청이 완료될 때까지 요청을 기다립니다. 로그인 페이지가 있습니다.vue와 나는 사용자가 이미 로그인한 경우 Home Component로 이동하고 그렇지 않으면 그대로 유지되는 전략을 사용하고 있습니다. 마이코드 mounted() { this.checkAlreadyLoggedIn(); }, methods: { async checkAlreadyLoggedIn() { this.busy = true; await this.$store.dispatch("attempt"); this.busy = false; if (this.$store.getters.loggedIn) { this.$navigateTo(Home, { clearHistory: true }); } }, } 서버에 작업 요청을..

모듈 저장소가 상태로 재설정됨 상태를 모듈화했을 때 VueX 스토어에서 리셋이 어떻게 작동하는지 알아보려고 합니다.VueX 구조는 다음과 같습니다. └── store ├── index.js └── module-cart ├── index.js ├── actions.js ├── mutations.js ├── state.js ├── getters.js 따라서 현재 모듈의 상태를 원래 상태로 리셋합니다. 나는 다음 돌연변이를 만들었다.module-cart/mutations.js파일: import initialState from './state.js'; export default { resetState(state) { Object.assign(state, initialState); } } 그래서 이 모듈의 sta..