javascript - vue 全局組件為什么不能跟vue實(shí)例分開(kāi)到不同的文件中？
問(wèn)題描述
global.js文件:var app;app = new Vue({ el: '#app', data: {value: 'hello world', }});login.js
Vue.component(’login’, { template: ’<h1>login</h1>’})index.html
<!DOCTYPE html><html lang='en'><head> <meta charset='UTF-8'> <title>Daemon</title> <script src='http://www.leifengta.com.cn/wenda/js/jquery-3.2.1.js' charset='UTF-8'></script> <script src='http://www.leifengta.com.cn/wenda/js/semantic.min.js' charset='UTF-8'></script> <script src='http://www.leifengta.com.cn/wenda/js/vue.js' charset='UTF-8'></script> <link rel='stylesheet' href='http://www.leifengta.com.cn/wenda/css/semantic.min.css'></head><body> <p id='app'><p class='ui container'> <p class='ui pider'></p> <p class='ui blue button'>{{value}} </p> <login></login></p> </p> <script src='http://www.leifengta.com.cn/wenda/js/global.js' charset='UTF-8'></script> <script src='http://www.leifengta.com.cn/wenda/js/login.js' charset='UTF-8'></script></body></html>
結(jié)果報(bào)錯(cuò):[Vue warn]: Unknown custom element: <login> - did you register the component correctly? For recursive components, make sure to provide the 'name' option.(found in <Root>)
哪位大俠能為小白指點(diǎn)下？
問(wèn)題解答
回答1：html中我做了一下修改，調(diào)整了js引入的順序，因?yàn)樾枰诒ＷCapp根組件渲染的時(shí)候，其中用到的組件已經(jīng)聲明注冊(cè)。
<!DOCTYPE html><html lang='en'><head> <meta charset='UTF-8'> <title>Daemon</title> <script src='http://www.leifengta.com.cn/wenda/js/jquery-3.2.1.js' charset='UTF-8'></script> <script src='http://www.leifengta.com.cn/wenda/js/semantic.min.js' charset='UTF-8'></script> <script src='http://www.leifengta.com.cn/wenda/js/vue.js' charset='UTF-8'></script> <link rel='stylesheet' href='http://www.leifengta.com.cn/wenda/css/semantic.min.css'></head><body> <p id='app'><p class='ui container'> <p class='ui pider'></p> <p class='ui blue button'>{{value}} </p> <login></login></p> </p> <script src='http://www.leifengta.com.cn/wenda/js/login.js' charset='UTF-8'></script> <script src='http://www.leifengta.com.cn/wenda/js/global.js' charset='UTF-8'></script></body></html>回答2：
全局API系列都必須在實(shí)例化之前申明
相關(guān)文章：
1. boot2docker無(wú)法啟動(dòng)2. docker-compose中volumes的問(wèn)題3. 關(guān)docker hub上有些鏡像的tag被標(biāo)記““This image has vulnerabilities””4. nignx - docker內(nèi)nginx 80端口被占用5. docker安裝后出現(xiàn)Cannot connect to the Docker daemon.6. javascript - mock.js可以存儲(chǔ)數(shù)據(jù)嗎7. java - SSH框架中寫分頁(yè)時(shí)service層中不能注入分頁(yè)類8. golang - 用IDE看docker源碼時(shí)的小問(wèn)題9. docker api 開(kāi)發(fā)的端口怎么獲取？10. dockerfile - 為什么docker容器啟動(dòng)不了？
網(wǎng)公網(wǎng)安備