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.gepszalag.com/wenda/js/jquery-3.2.1.js' charset='UTF-8'></script> <script src='http://www.gepszalag.com/wenda/js/semantic.min.js' charset='UTF-8'></script> <script src='http://www.gepszalag.com/wenda/js/vue.js' charset='UTF-8'></script> <link rel='stylesheet' href='http://www.gepszalag.com/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.gepszalag.com/wenda/js/global.js' charset='UTF-8'></script> <script src='http://www.gepszalag.com/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.gepszalag.com/wenda/js/jquery-3.2.1.js' charset='UTF-8'></script> <script src='http://www.gepszalag.com/wenda/js/semantic.min.js' charset='UTF-8'></script> <script src='http://www.gepszalag.com/wenda/js/vue.js' charset='UTF-8'></script> <link rel='stylesheet' href='http://www.gepszalag.com/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.gepszalag.com/wenda/js/login.js' charset='UTF-8'></script> <script src='http://www.gepszalag.com/wenda/js/global.js' charset='UTF-8'></script></body></html>回答2：
全局API系列都必須在實例化之前申明
相關文章：
1. 在mac下出現了兩個docker環境2. html - sumlime text3代碼自動補全功能問題！3. web - css3 @keyframes用一次后面的任何樣式就解析不了了.4. javascript - 有一個異步獲取數據的函數A，其他依賴這個A得到的數據的函數是否都必須是異步的？5. css3 - 給body設置了translate3d，動畫的同時導致內部的fixed元素失效？6. node.js - win7 grunt不是內部或外部命令。7. 想練支付寶對接和微信支付對接開發（Java），好像個人不可以，怎么弄個企業的呢？8. node.js - 用node做微信開發后臺，獲取access_token報錯9. css3 - 求css頁面解決方案10. javascript - 大神們，求救啊，搞百度編輯器，弄了三天了，問題，如下
網公網安備