Vue 2: 렌더 함수에서 단일 파일 컴포넌트를 렌더링하는 방법

Vue 2: 렌더 함수에서 단일 파일 컴포넌트를 렌더링하는 방법

렌더링 함수에서 Single File Vue 구성 요소를 렌더링하려고 하는데 생성되지 않습니다.다음과 같은 변형을 시도했습니다.

// simple.vue
<template>
...
</template>
<script>
 ...
</script>

// parent.vue
<script>
import Simple from 
export default {
  name: "parentComponent",
  render: function (h) {
    return h(
      "div",
      null,
      Simple  // [Simple], Vue.component(Simple)
  }
}
</script>

렌더 기능을 사용하여 Vue 컴포넌트를 빌드하려면 어떻게 해야 합니까?차이가 있다면 나도 퍼그를 쓰고 있어.

제가 제대로 이해했다면, 렌더링 함수에서 단일 파일 구성요소로 쓸 수 있는 구성요소를 렌더링하고 싶을 뿐입니다.이것은 하기 쉽다.

다음과 같은 단일 파일 구성 요소가 있다고 가정합니다.

Child.vue

<template>
  <h1>This is the Child component</h1>
</template>

렌더링 기능을 사용하는 컴포넌트에서 렌더링합니다.여기 그것을 하는 예가 있다.

Parent.js

import Child from "./Child.vue"

export default {
  render(h){
    return h("div", ["Text in Parent", h(Child)])
  },
  components: {Child}
}

여기 작업 예가 있습니다.

중요한 점은 컴포넌트를 렌더링할 때 컴포넌트 정의를 첫 번째 인수로 전달하기만 하면 된다는 점입니다.createElement기능(상기 에일리어스)h@Phil이 댓글로 지적한 내용입니다. h(Child)하위 구성 요소를 만듭니다.기술적으로 Vue는 구성 요소의 인스턴스를 렌더링하는 데 사용하는 가상 노드를 생성합니다.

이 모든 것에 대해서는, 메뉴얼에 잘 기재되어 있습니다.

언급URL : https://stackoverflow.com/questions/47403902/vue-2-how-to-render-single-file-components-from-render-functions