반응형

vuejs2 140

vue jsx에서 템플릿 범위를 사용하는 방법

vue jsx에서 템플릿 범위를 사용하는 방법 다음과 같이 단순한 자 컴포넌트(testSlot.vue)를 정의합니다. this is title 이렇게 html 템플릿에서 사용할 수 있습니다. {{props.text}} this is real body jsx에서 어떻게 사용할 수 있나요?문서를 3번 읽었더니 O(__))O라는 질문에 스스로 대답할 수 있게 되었습니다. 슬롯명은 디폴트입니다. scopedSlots.default(= vm)의 스코프에 액세스할 수 있습니다.$scopedSlots.default) 콜백 인수 'callback'은 소품 보유자입니다. 반환되는 값은 하위 구성 요소에서 노출되는 범위와 연결한 vNode입니다. jsx는 렌더링 함수의 구문설탕에 불과하지만 여전히 createElement..

programing 2022.08.31

vue with joke - 비동기 호출을 사용한 테스트

vue with joke - 비동기 호출을 사용한 테스트 어떻게 하면 내 API 결과를 기다릴 수 있을까요?나는 내 컴포넌트를 테스트하기 위해 vue와 joke를 사용하고 있다. 클라이언트를 데이터베이스에 쓰는 방법을 테스트하고 싶습니다.내 컴포넌트에는 다음과 같은 방법이 있습니다. methods: { onSubmitClient(){ axios.post(`urlApi`, this.dados).then(res => { return res; }) } } 내 시험에서는 describe('login.vue', () => { let wrapper beforeAll(()=>{ wrapper = mount(client, { stubs: ['router-link'], store, data() { return { dad..

programing 2022.08.31

Angular와 같이 Vue.js 컴포넌트를 작성하면서 HTML, JS 및 CSS 파일을 분리하여 유지할 수 있습니까?

Angular와 같이 Vue.js 컴포넌트를 작성하면서 HTML, JS 및 CSS 파일을 분리하여 유지할 수 있습니까? Vue.js는 HTML, JS의 CSS를 사용하고 있습니까? 'Vue.js가 템플릿을 지원하지 않는 이유'에 대해 설명했습니다.URL" 기사를 참조하십시오.기사 자체에는 이렇게 되어 있다. "대규모로 유지보수가 가능한 것을 구축하려면 적절한 모듈화가 필요합니다. 그 를 더하고 있습니다.저는 Angular 배경에서 왔고 HTML, JS, CSS를 분리하는 것이 개발 중에 매우 도움이 된다고 생각합니다.그러나 위 기사의 저자는 다른 의견을 가지고 있다. 이 및 할 수 .HTML, JS, CSS, CSS. 모듈식과는 별도로, 분리를 실시하면, 이러한 자산을 다른 장소에서도 재사용할 수 있습니..

programing 2022.08.31

컴포넌트 외부에서 VueI18n을 사용하는 데 문제가 있습니다.

컴포넌트 외부에서 VueI18n을 사용하는 데 문제가 있습니다. 컴포넌트 외부에서 i18n을 사용하려고 합니다.이 솔루션 https://github.com/dkfbasel/vuex-i18n/issues/16에서는 Vue.i18n.translate('str')를 사용하도록 지시하고 있습니다만, 이 에러가 발생했을 때, 「Cannot read property 'defined」라는 에러가 발생합니다. 다음 구성을 사용하고 있습니다. main.discloss.main.discloss. import i18n from './i18n/i18n'; new Vue({ router, store, i18n: i18n, render: h => h(App) }).$mount('#app') i18n.displaces import..

programing 2022.08.31

v-bind로 특성을 한 번만 바인딩하는 방법

v-bind로 특성을 한 번만 바인딩하는 방법 현지화에 vue-i18n을 사용하고 있습니다.다음과 같이 입력 플레이스 홀더를 변환하는 경우: 를 사용해야 합니다.$t()이 기능은 재검출 시마다 실행됩니다(도큐먼트에 기재되어 있는 것도 마찬가지입니다).이것에 의해, 간단한 예약 폼에 불필요한 기능 호출이 수천개 추가되어 버립니다. Atribute를 한 번만 바인드할 수 있는 방법이 있나요?변환된 값은 Vue 인스턴스의 라이프사이클 전체에 걸쳐 변경되지 않습니다. v-once컴포넌트/노드를 무효로 해, 어트리뷰트만을 「하드 코드」하고 싶기 때문에, 이것은 내가 찾고 있는 것이 아닙니다. 데이터 오브젝트에 번역된 문자열을 저장하는 것만으로 필요한 것을 얻을 수 있다는 것은 알고 있습니다만, 대체적이고 심플한 ..

programing 2022.08.31

VueJS - 로컬 json 파일에서 vis.js 타임라인으로 데이터 읽기

VueJS - 로컬 json 파일에서 vis.js 타임라인으로 데이터 읽기 제 질문은 로컬 JSON 파일을 읽는 것에 관한 것입니다.VueJS 어플리케이션을 만들고 있습니다.이렇게 json 파일에서 Vue 컴포넌트로 데이터를 로드하려고 합니다. 내 폴더에는 다음과 같은 작은 JSON 파일 timeline.json이 있습니다. { "id": 1, "content": "General Checkup", "start": "2017-01-20", "title": "General check-up" } 스크립트를 로딩하려고 하면 컨트롤이 로딩되지 않는 것 같습니다.$.getJSON기능.콘솔에 에러는 없다.내가 뭘 잘못하고 있지?Import를 사용하면 정적 JSON 파일을 읽을 수 있습니다.그런 다음 데이터를 할당합니..

programing 2022.08.30

vue.js cli 명령어 "npm run serve" 작동 방식

vue.js cli 명령어 "npm run serve" 작동 방식 실행 후npm run serve그것은 다음과 같은 주소를 준다.http://localhost:8080동작합니다.이 주소는 로컬서버의 루트 폴더를 대상으로 하고 있습니다만, 제 프로젝트는 다음과 같은 다른 폴더가 존재합니다.http://localhost/vue 그리고 제 질문은 어떻게 주소가http://localhost:8080실제는 어디에 있습니까?index.html? 실제 프로젝트 배치 이후localhost/vue폴더! 주소는 http://localhost/vue여야 합니다.서브를 사용할 때 백그라운드에서 무슨 일이 일어나고 있는지 좀 헷갈리시는 것 같아요. 명령어를 실행하고 있는 경우npm run serve프로젝트는 웹 팩에 의해 구축..

programing 2022.08.29

Vue 라우터 입력 전 vs 각 입력 전

Vue 라우터 입력 전 vs 각 입력 전 로그인하지 않은 사용자를 모든 페이지에서 다음 페이지로 리디렉션하려고 합니다./login.나는 노력했다.beforeEach()그러나 사용자가 다음과 같은 direct url로 사이트에 들어가면 부팅되지 않습니다./home,/event. 루트별 가드beforeEnter()는, 유저가 특정의 페이지에 액세스 하면 기동하기 때문에, 완전하게 동작합니다.단, 추가가 필요합니다.beforeEnter()모든 경로에서요. 나는 그것을 복제하는 방법을 찾고 있다.beforeEnter()라우터의 거의 모든 페이지(다이나믹페이지에서도)에서, 유저 이외의 유저는 리다이렉트 됩니다./login. 이것은 사용자가 직접 URL을 사용하여 입력했을 때 작동합니다./home. routes: ..

programing 2022.08.29

하위 컴포넌트에서 부모 메서드를 호출합니다(Vue.js).

하위 컴포넌트에서 부모 메서드를 호출합니다(Vue.js). 프로젝트를 진행 중인데 하위 구성 요소에서 부모 메서드를 호출해야 합니다.Vue.js에서 이를 실현하려면 어떻게 해야 합니까?를 사용해 주세요.this.$emit('myEvent')상위 구성 요소에서 메서드를 트리거할 때 하위 구성 요소 내부. 그런 다음 부모 템플릿에서 자식 구성 요소를 찾고 다음과 같이 이벤트 수집기를 추가합니다. 메서드에 파라미터를 추가하려면 다음과 같이 두 번째 파라미터를 내보내기에 추가할 수 있습니다. this.$emit("myEvent", "My parameter") 호출하는 메서드에 파라미터가 있는 한 이벤트 "catcher"에서 아무것도 변경할 필요가 없습니다. 예를 들면 좀 더 명확하게 할 수 있을 겁니다. htt..

programing 2022.08.29

플렉스-컬럼을 사용하여 다른 항목을 고정하는 동안 하나의 플렉스박스 항목만 스크롤

플렉스-컬럼을 사용하여 다른 항목을 고정하는 동안 하나의 플렉스박스 항목만 스크롤 https://codepen.io/james-hudson3010/pen/dyMyVMg에서 문제를 설명하는 CodePen을 가지고 있습니다. 난 내가 원하는 것에 가까워...목록이 스크롤되는 동안 "Toggle List" 버튼이 있는 맨 위 항목은 고정된 상태로 유지됩니다.단, 리스트의 맨 아래까지 올라가면 맨 위 아이템이 올라갑니다.맨 위 항목은 고정된 상태로 유지됩니다. 플렉스 박스의 높이를 확인하면 예상되는 높이입니다. 즉, 본체의 높이 - 헤더 높이 - 푸터의 높이입니다. 플렉스 아이템의 높이는 플렉스 박스의 높이에 따라 결정된다고 생각했지만 플렉스 아이템은 자유로워질 수 있는 것 같습니다만…그게 사실입니까? JS: ..

programing 2022.08.29
반응형