在线观看不卡亚洲电影_亚洲妓女99综合网_91青青青亚洲娱乐在线观看_日韩无码高清综合久久

鍍金池/ 問(wèn)答/HTML/ 使用 typescript 編寫 vue app,渲染時(shí)提示未知的自定義組件

使用 typescript 編寫 vue app,渲染時(shí)提示未知的自定義組件

目前的做法是這樣的:
首先在 src 目錄下寫個(gè) modules.d.ts 文件定義 vue 模塊:

// modules.d.ts
declare module "*.vue" {
    import Vue from "vue";
    export default Vue;
}

然后打算在 components 文件夾下寫一個(gè) index.ts 來(lái)導(dǎo)入所有的組件,方便其他地方導(dǎo)入:

// components/index.ts
import App from './app/app.vue';
import Pager from './pager/pager.vue';

export { App, Pager };

最后在用到子組件的組件中用 vue-class-component@Component 來(lái)注冊(cè)子組件:

// components/app/app.ts
import { Pager } from '@/components';
@Component({
    components: {
        'pager': Pager
    }
})
export default class App extends Vue {

}

但是渲染的時(shí)候子組件并沒(méi)有被渲染出來(lái),控制臺(tái)報(bào)錯(cuò):

[Vue warn]: Unknown custom element: <pager> - did you register the component correctly? For recursive components, make sure to provide the "name" option.

這里如果我直接導(dǎo)入 vue 文件的話又能夠正確渲染:

// components/app/app.ts
//import { Pager } from '@/components';
import Pager from '@/components/pager/pager.vue';
@Component({
    components: {
        'pager': Pager
    }
})
export default class App extends Vue {

}

請(qǐng)問(wèn)這種做法有錯(cuò)誤嗎,正確的做法應(yīng)該是怎樣的?

目錄結(jié)構(gòu):

.
`-- src
    |-- components
    |   |-- app
    |   |   |-- app.css
    |   |   |-- app.ts
    |   |   `-- app.vue
    |   |-- index.ts
    |   `-- pager
    |       |-- pager.css
    |       |-- pager.ts
    |       `-- pager.vue
    `-- modules.d.ts
回答
編輯回答
初心

你按照他的提示,把 name 屬性加上看看。

components: {

    'name': 'page1',
    'pager': Pager
}
2017年12月29日 08:24