Vue의 구성 요소에 CSS 스타일을 추가하는 방법: 먼저 [.vue] 파일에 관련 코드를 설정한 다음 새 [index.js] 파일을 만들고 해당 [record.scss] 파일을 만듭니다.
이 튜토리얼의 운영 환경: Windows 7 시스템, Vue 버전 2.9.6, Dell G3 컴퓨터.
【추천 관련 기사: vue.js】
vue의 구성 요소에 CSS 스타일을 추가하는 방법:
먼저 .vue
파일에서 다음 설정을 지정합니다.
<template src="./record.html"></template> <script src="./record.js"></script> <style src="./record.scss"></style>
새 index.js 만들기
import record from './record.vue'; export default record;
해당 Record.html, Record.js, Record.scss 파일을 생성하세요. .js를 예로 들어보세요:
// -- NAME -- const name = 'record'; // -- DATA -- const data = function () { return { }; }; // -- COMPUTED -- const computed = { }; // -- COMPONENTS -- const components = { } // -- WATCH -- const watch = { }; // -- METHODS -- const methods = { }; // -- HOOKS -- function mounted() { } // == EXPORT == export default { name: name, data: data, components: components, computed: computed, watch: watch, methods: methods, mounted: mounted };
또 다른 방법을 직접 인용할 수 있습니다:
<template> <div>html</div> </template> <script src="./***.js"></script> <style src="./***.css"></style>
다양한 방법이 있습니다. 양식이지만 기본 아이디어는 모두 별도의 독립된 파일이며 소개 및 로딩
관련 무료 학습 권장 사항: javascript(동영상)
위 내용은 Vue의 구성 요소에 CSS 스타일을 추가하는 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!