반응형

vuejs2 8

라라벨의 예.vue가 업데이트되지 않음

라라벨의 예.vue가 업데이트되지 않음 라라벨 5 프로젝트에서 Vue를 사용하는 방법을 찾고 있습니다.기본 Laravel 설치는 app.js 및 Example.vue와 함께 제공됩니다.home.blade.php에 추가하여 뷰에 "I am a example component!"라고 표시할 수 있었습니다.저를 혼란스럽게 하는 것은 무엇보다도 이 컴포넌트를 전혀 변경할 수 없다는 것입니다. Example.vue에서 텍스트를 변경해도(논리가 아닌 템플릿 부분만) 전혀 업데이트되지 않습니다.(Laravel docs 등에 따라 npm run dev를 실행하려고 하면 오류 없이 컴파일 되는 것 같고 /public/js/app.js는 변경되지만 브라우저 표시는 변경되지 않습니다.) app.blade를 수정할 때.php..

programing 2022.07.02

vue cli 빌드 후 운영 사이트 실행 방법

vue cli 빌드 후 운영 사이트 실행 방법 VueCLI 2를 사용하여 운영 환경으로 구축하고 있습니다.build.js는 200KB로 구축 및 컴파일됩니다.서버를 개발로 재실행했을 때 3MB가 로딩되어 있었습니다.dist 폴더 내의 build.js는 200KB일 것입니다.index.html을 열려고 했는데 작동하지 않고 웹 사이트의 루트 디렉토리로 리디렉션됩니다. 패키지json "scripts": { "dev": "cross-env NODE_ENV=development webpack-dev-server --open --hot", "build": "cross-env NODE_ENV=production webpack --progress --hide-modules" }, 웹 팩 module.exports =..

programing 2022.07.02

Vue.js - 데이터 요청이 완료될 때까지 페이지 렌더링을 연기합니다.

Vue.js - 데이터 요청이 완료될 때까지 페이지 렌더링을 연기합니다. 서버에서 가져온 데이터를 엑시스로 표시하는 페이지가 있습니다. Axios 요청이 완료될 때까지 페이지 렌더링을 연기하고 싶습니다. 그 이유는 페이지의 렌털 버전이 있기 때문입니다.따라서 Axios 요청이 실행 중일 때 (CLS 문제를 방지하기 위해) 빈 화면이 아닌 사전 렌더링된 데이터를 표시하고 싶습니다. 현재 가지고 있는 것은 다음과 같습니다. export default { .... created() { this.fetchData().then((returnedData) => this.personData = returnedData); }, data() { return { personData: { name: "", }, }; }, ..

programing 2022.07.02

Vuetify 컴포넌트의 소품을 글로벌하게 설정(내 경우는 'v-data-table')

Vuetify 컴포넌트의 소품을 글로벌하게 설정(내 경우는 'v-data-table') 사용 사례는 다음과 같습니다. 프로펠의 디폴트값rows-per-page-items위해서v-data-table이[5,10,25,{"text":"$vuetify.dataIterator.rowsPerPageAll","value":-1}] API 문서 나는 이 소품을 분해하고 새로운 가치관을 갖고 싶다.[10,25,50]현재 데이터 테이블 컴포넌트는 앱의 여러 곳에서 사용되고 있습니다.자, 제 질문은 다음과 같습니다. 앱의 모든 테이블에서 변경되도록 이 프로펠을 전체적으로 재정의할 수 있는 방법이 있습니까?언급URL : https://stackoverflow.com/questions/54095932/set-props-glob..

programing 2022.07.02

.addEventListener 내의 Vue.protype에 액세스하는 방법

.addEventListener 내의 Vue.protype에 액세스하는 방법 의 글로벌 오브젝트에 접속하려고 합니다.Vue.prototype.$firebase에 선언되어 있습니다.main.js import Vue from "vue"; import App from "./App.vue"; import router from "./router"; import VueTailwind from "vue-tailwind"; import { FirebaseApp } from "@/firebase/firebase"; //Style import "@/assets/styles/app.css"; import settings from "@/assets/styles/Tailwind.js"; FirebaseApp.auth().onA..

programing 2022.07.02

Vue 2 - Ajax 응답에서 컴포넌트를 렌더링합니다.

Vue 2 - Ajax 응답에서 컴포넌트를 렌더링합니다. ajax 응답에서 가져온 컴포넌트를 렌더링하는 방법이 있습니까?예를 들어 컴포넌트 "Test"를 등록하면 Ajax 응답에 다음과 같은 내용이 있습니다. dummy paragraph another dummy paragraph 최종 목표는 사용자가 콘텐츠 영역에 라우터 링크를 삽입할 수 있는 쇼트 코드를 만드는 것입니다. Vue 2, vue 라우터를 사용하고 있습니다. 편집: 여기 데모 https://jsfiddle.net/Paulius_Krutkis/4mb1ypqs/가 있습니다.여기서 당신이 직면하고 있는 정확한 문제가 무엇인지 잘 모르겠습니다.만약 당신이 ajax 호출에서 반환된HTML을 어떻게 렌더링하는지를 찾고 있다면 HTML을 가진 문자열 변..

programing 2022.07.02

입력용 Vue 필터 / V-모델

입력용 Vue 필터 / V-모델 그래서 저는 ES6 SPA Javascript와 Vue JS를 처음 접합니다.저는 주로 JQuery를 사용하고 있습니다. 그래서 글로벌 필터가 있는데 Vue.filter('formatDate', function (value) { if (value) { return moment(String(value)).format('Do MMMM YYYY') } }) Vuetify도 사용하고 있습니다.그 필터를 데이터 테이블과 함께 사용할 수 있습니다. {{ props.item.DateAdded | formatDate }} 하지만, 그것은 나에게 효과가 없습니다.v-model내가 뭘 잘못하고 있는 거야? 나도 노력했어v-bind:value포맷하고 싶은 입력값으로?운이 없다. 도와주세요? ..

programing 2022.07.02

v-btn 내부 라우팅과 라우터 링크 사용의 차이점

v-btn 내부 라우팅과 라우터 링크 사용의 차이점 저는 Vue.js를 배우고 있으며 튜토리얼에 따라 a를 사용하여 페이지를 다른 페이지로 라우팅합니다.그는 이 태그로 감긴 버튼을 사용했고, 나는 태그 안에 있는 라우팅 지시서를 사용한다는 것을 발견했다.한 페이지에서 다른 페이지로 이동하는 이 두 가지 방법의 차이가 무엇인지 궁금했습니다.둘 다 같은 동작을 하고 있는 것 같습니다(페이지 변경 시 데이터 송수신은 하고 있지 않습니다). 비교 코드: v-btn 사용 add 라우터 링크 사용 Tab Tracker 잘 부탁드립니다!v-btnvuetifyjs의 구성요소인데 반해router-linkvue-module의 컴포넌트입니다. 사용할 때v-btn와 함께topath 객체를 전달함으로써 vue-link 컴포넌트..

programing 2022.07.02
반응형