Vue.js(part1) 처음 사용

4531 단어 JavaScriptVue.jstech

로컬 환경js 설치


vue.js 공식 사이트https://cli.vuejs.org/guide/installation.html）。
  • 터미널에서 설치 명령 입력
    npm install -g @vue/cli
  • 프로젝트 만들기
    vue create hello_world
  • localhost에서 프로젝트 실행
    아주 좋아요.js가 GUI에서 프로젝트를 수행하기 때문에 그 모형을 볼 수도 있고 GUI에서 프로젝트를 만들 수도 있기 때문에 초보자라도 걸려 넘어지지 않습니다.
    vue ui
    GUI를 사용하지 않으려는 경우
    npm run serve
    를 참고하십시오.

    • 구성 요소


    Vue.js에서 React처럼 구성 요소를 만들면 여러 번 재사용할 수 있습니다.vue create hello_world에서 프로젝트를 만들 때 생성된 폴더 내의 App.vue 및 src 폴더 내의 src/components 섹션입니다.
  • 새 구성 요소를 만들려면 먼저 HelloWorld.vue 폴더에서 src/components 이름으로 만듭니다.
  • 구성 요소의 쓰기 방법은 다음과 같습니다.(저는 개인적으로 js, css,}를 예쁘게 나누는 것을 좋아합니다.)
    <template>
	<div>
			HTML要素
	</div>
</template>

<script>
スクリプト関係
</script>

<style scoped>
CSS関係
</style>
  • 만드는 법.名前.vue 라벨에 <script></script>라고 쓰고, export default{}에 {}라고 기술한다.예제
    export default {
	methods: {
		print_something: function() {
			 console.log("Something");
  • 클릭 이벤트에서 사용하는 방법.
    <button v-on:click="print_something">print!</button>
    • 원숭이도 알아!파이톤에서 FC2 블로그를 자동으로 업데이트하는 방법을 알려드릴게요.
    java8List에서 대상 속성의 무게 제거 실현

    좋은 웹페이지 즐겨찾기

    개발자 우수 사이트 수집

    개발자가 알아야 할 필수 사이트 100선 추천 우리는 당신을 위해 100개의 자주 사용하는 개발자 학습 사이트를 정리했습니다
    best100-homepage