.vueファイル内でレンダリング機能を使用することはできますか

Question

コンポーネントのhtmlタグを動的に設定することを検討しています。例えば：

components: { 
    test: { 
     props: ['tag', 'attributes'], 
     render(createElement) { 
     return createElement(this.tag || 'div', {attrs: this.attributes || {}}, this.$slots.default); 
     } 
    } 
    } 

私は、htmlファイルに次のようなコードを使用することができます：

今

<test tag="a" :attributes="{href:'http://www.google.com'}">a tag content</test> 
<test tag="p">p tag content</test> 

を、私は何をしたいのVueローダーのようなものを使用して、私のコンポーネントを分割しています。基本的には、異なるコンポーネントを別々のファイルに分割し、main.jsファイルを使用してインポートする必要があります。

私はこのような何かを試してみましたが、それは動作しません：

// components/test.js 
export default { 
    components: { 
    test: { 
     props: ['tag', 'attributes'], 
     render(createElement) { 
     return createElement(this.tag || 'div', {attrs: this.attributes || {}}, this.$slots.default); 
     } 
    } 
    } 
} 

// main.js 
import Vue from 'vue' // don't think this is relevant, but it's there 
import Test from './components/Test.js' 
new Vue({ 
    el: '#app', 
    components: { 
     Test 
    } 
}) 

これは思考を動作しません。

どのように動作させることができますか？

おかげ

Answer 1

構造は次のようにtest.js：

export default { 
     props: ['tag', 'attributes'], 
     render(createElement) { 
     return createElement(this.tag || 'div', {attrs: this.attributes || {}}, this.$slots.default); 
     } 
}