javascript - vue 全局組件為什么不能跟vue實例分開到不同的文件中？
問題描述
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.aoyou183.cn/wenda/js/jquery-3.2.1.js' charset='UTF-8'></script> <script src='http://www.aoyou183.cn/wenda/js/semantic.min.js' charset='UTF-8'></script> <script src='http://www.aoyou183.cn/wenda/js/vue.js' charset='UTF-8'></script> <link rel='stylesheet' href='http://www.aoyou183.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.aoyou183.cn/wenda/js/global.js' charset='UTF-8'></script> <script src='http://www.aoyou183.cn/wenda/js/login.js' charset='UTF-8'></script></body></html>
結果報錯:[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>)
哪位大俠能為小白指點下？
問題解答
回答1：html中我做了一下修改，調整了js引入的順序，因為需要在保證app根組件渲染的時候，其中用到的組件已經聲明注冊。
<!DOCTYPE html><html lang='en'><head> <meta charset='UTF-8'> <title>Daemon</title> <script src='http://www.aoyou183.cn/wenda/js/jquery-3.2.1.js' charset='UTF-8'></script> <script src='http://www.aoyou183.cn/wenda/js/semantic.min.js' charset='UTF-8'></script> <script src='http://www.aoyou183.cn/wenda/js/vue.js' charset='UTF-8'></script> <link rel='stylesheet' href='http://www.aoyou183.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.aoyou183.cn/wenda/js/login.js' charset='UTF-8'></script> <script src='http://www.aoyou183.cn/wenda/js/global.js' charset='UTF-8'></script></body></html>回答2：
全局API系列都必須在實例化之前申明
相關文章：
1. java固定鍵值轉換，使用枚舉實現字典？2. vim - win10無法打開markdown編輯器3. mysql - 千萬數據 分頁，當偏移量 原來越大時，怎么優化速度4. 如何解決tp6在zend中無代碼提示5. javascript - 有沒有類似高鐵管家的時間選擇插件6. 這是什么情況？？？7. python - flask學習，user_syy添加報role is invalid keyword for User.8. css - BEM 中塊(Block)有木有什么標準 何時決定一個部分提取為塊而不是其父級的元素呢(Element)?~9. css3 - less或者scss 顏色計算的知識應該怎么學?或者在哪里學?10. javascript - 微信網頁開發從菜單進入頁面后，按返回鍵沒有關閉瀏覽器而是刷新當前頁面，求解決？
網公網安備