반응형

vuejs2 121

범위 외의 vue.js 컴포넌트 데이터를 변경하는 방법

범위 외의 vue.js 컴포넌트 데이터를 변경하는 방법 기본 내보내기 문 이외의 vue.js 데이터를 변경합니다.아래 예시를 들자면 어떻게 해야 할까요? {{ name }} 구성 요소를 변수/정수에 할당하는 경우 데이터 개체의 프록시 세터를 트리거하거나 구성 요소 수준 메서드를 사용하여 트리거할 수 있습니다. const component = new Vue({ data() { return { name: "Initial value." } }, methods: { changeName(newName) { this.name = newName; } } }); // Mount it to an element (for demo purposes) component.$mount('#app'); document.getElem..

source 2022.08.30

WebPack 빌드 프로세스 없이 HTML 페이지에서 VueJS .vue 컴포넌트를 사용하는 방법

WebPack 빌드 프로세스 없이 HTML 페이지에서 VueJS .vue 컴포넌트를 사용하는 방법 레거시 서버 렌더링 프로젝트의 페이지를 만들고 있습니다. 페이지 중 하나에 "다이나믹"을 추가해야 합니다.그런 다음 vuejs CDN 스크립트를 가져와 인라인 vue 개체를 만듭니다. var v = new Vue(... 그런데 마음에 드는 .vue 컴포넌트가 있어서 페이지에 추가하고 싶습니다.그러나 이 컴포넌트는 WebPack Import 및 빌드 프로세스를 통해서만 추가할 수 있는 것 같습니다. WebPack 빌드 프로세스 없이 html 페이지에서 이 컴포넌트를 사용하려면 어떻게 해야 합니까?가능할까요?이 문서에서 설명하는 대로 poi를 사용할 수 있습니다. poi build Component.vue --..

source 2022.08.30

Vue에서 하위 구성 요소에서 상위 구성 요소로 데이터 전달

Vue에서 하위 구성 요소에서 상위 구성 요소로 데이터 전달 Vue JS를 연습하고 있는데 이벤트를 내보내는 하위 구성 요소에서 상위 구성 요소로 데이터를 전달하는 방법을 알고 싶습니다.이것은 나의 부모 컴포넌트 BookList 입니다. Author Title Publishing House Edition Date {{ book.author}} {{ book.title}} {{ book.publishing_house}} {{ book.edition_date}} 다음은 BookForm 컴포넌트의 코드입니다.이 컴포넌트에서 Book 데이터를 입력하고 'book-is-created' 및 Book 객체를 표시하는 BookList를 업데이트합니다. Author Title Publishing house Edition..

source 2022.08.29

텍스트 필드 사용자 정의 및 선택

텍스트 필드 사용자 정의 및 선택 커스터마이즈하려고 합니다.v-text-field와 함께v-selecy는 몇 가지 문제에 직면했습니다. 커스터마이즈 할 수 있었습니다.v-text-field- 폰트, 마진, 매딩 등을 변경.잘 먹히긴 하는데, 내가 뛰어들었을 때v-select보이는 것처럼 쉽지 않아요 다음은 의 코드입니다.v-select컴포넌트: 관습v-text-field 선택한 경우 맨 아래, 줄 및 오른쪽 글꼴 아이콘으로 이동해야 합니다.매끈하게 스타일링 할 수 있는 방법이 있을까요?언급URL : https://stackoverflow.com/questions/51521828/customizing-vuetify-text-fields-and-selects

source 2022.08.29

vue-i18n에서 십진수 및 십진수 없이 통화를 표시하려면 어떻게 해야 합니다.

vue-i18n에서 십진수 및 십진수 없이 통화를 표시하려면 어떻게 해야 합니다. 다음 구성에서 통화로 금액을 출력할 수 있습니다. const numberFormats = { "en-GB": { currency: { style: 'currency', currency: 'GBP' } }, "en-US": { currency: { style: 'currency', currency: 'USD' } } } 컴포넌트 내부 {{ $n(100.20, 'currency') }} 출력 가능: £100.20 경우에 따라서는 다음과 같은 포맷이 좋을 수 있지만, £5, £10 etc 등 간단한 금액을 출력해야 하는 경우.나는 못한다.설정하려고 했지만 실패했어요.그vue-i18n docs는 숫자 형식에 옵션을 포함할 수 있으..

source 2022.08.29

Vue | vue-modent.js에 관한 문제

Vue | vue-modent.js에 관한 문제 .vue 파일 내의 vue-modement 또는 moment.js의 실장에 대해 머리를 싸매는 문제가 있습니다.따라서 vue 메서드에 날짜를 지정하여 이전 시간과 현재 시간 사이의 시간 범위를 찾아 실시간으로 업데이트할 수 있도록 합니다.모든 구글 검색은 순간으로 나를 안내했다.js main.js 파일에 구현되어 있습니다. import VueMoment from 'vue-moment'; Vue.use(VueMoment); 그런 다음 이렇게 템플릿 내의 메서드에 액세스하려고 합니다. {{ moment(1481889223).format('MMMM Do YYYY, h:mm:ss a') }} 제가 잘못하고 있는 내재적인 무언가가 있나요?날짜/시간을 출력할 시간이 ..

source 2022.08.29

VueJS 라우터의 'path'와 'fullPath'의 차이점은 무엇입니까?

VueJS 라우터의 'path'와 'fullPath'의 차이점은 무엇입니까? 인마이router.js파일, 파일,beforeEach방법, 이해했습니다.path그리고.fullPath의 성질에 있어서to그리고.from파라미터를 지정합니다.리다이렉트용으로 어떤 것을 사용하면 좋을지 고민하고 있습니다.둘 다 사용한 적이 있는데, 어떤 것을 언제 사용해야 하는지, 둘 다 어떻게 다른지 모르겠어요. 예: export default new Router({ mode: 'history', base: process.env.BASE_URL, routes: [{ path: 'login' beforeEnter: (to, from, next) => { console.log(to, from) // the routes if (User..

source 2022.08.29

Vue에서 하드코드된 favicon을 제거하는 방법은?

Vue에서 하드코드된 favicon을 제거하는 방법은? PWA 플러그인과 i18n이 함께 설치된 Vue CLI 3이 있습니다. /public/의 모든 Vue 아이콘 파일(/public/img/icons의 PNG 포함), /src/interval의 logo.png 파일, /public/index.json의 link(rel=icon) 태그 제거, 기존 Vue 아이콘 파일에 대한 참조를 삭제하도록 manifest.json을 변경했으며 아직 페이지를 로드하지 않았습니다.DOM의 ed 링크: 이러한 파일은 존재하지 않으며 프로젝트 어디에서도 참조되지 않습니다.여기서 가장 이상한 점은 모든 파일을 삭제한 후에도 사용하는 브라우저에 기본 Vue favicon이 계속 표시되므로 클라이언트 측 캐시는 절대 아닙니다. 이..

source 2022.08.29

VueJS | 메서드 "watch"의 컴포넌트 정의에 "object" 유형이 있습니다.

VueJS | 메서드 "watch"의 컴포넌트 정의에 "object" 유형이 있습니다. 현재 다음 시계를 가지고 있습니다.Product.vue파일 watch: { isOnline: { async handler (isOnline) { if (isOnline) { const maxQuantity = await this.getQuantity(); this.maxQuantity = maxQuantity; } } }, isMicrocartOpen: { async handler (isOpen) { if (isOpen) { const maxQuantity = await this.getQuantity(); this.maxQuantity = maxQuantity; } }, immediate: true }, isSampl..

source 2022.08.29

웹 팩을 사용하여 하나의 프로젝트에서 여러 Vuejs 컴포넌트를 npm에 게시합니다.

웹 팩을 사용하여 하나의 프로젝트에서 여러 Vuejs 컴포넌트를 npm에 게시합니다. 두 개 이상의 Vue 컴포넌트를 포함하는 프로젝트를 npm에 게시하려고 합니다.이것에 의해, 다음과 같이 양쪽의 컴포넌트를 Import, 등록, 사용할 수 있습니다. import Component1 from 'npm-package' import Component2 from 'npm-package' 웹 팩 파일입니다. const webpack = require('webpack'); const merge = require('webpack-merge'); const path = require('path'); var config = { output: { path: path.resolve(__dirname + '/dist/'),..

source 2022.08.28
반응형