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://m.lshqa.cn/wenda/js/jquery-3.2.1.js' charset='UTF-8'></script> <script src='http://m.lshqa.cn/wenda/js/semantic.min.js' charset='UTF-8'></script> <script src='http://m.lshqa.cn/wenda/js/vue.js' charset='UTF-8'></script> <link rel='stylesheet' href='http://m.lshqa.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://m.lshqa.cn/wenda/js/global.js' charset='UTF-8'></script> <script src='http://m.lshqa.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://m.lshqa.cn/wenda/js/jquery-3.2.1.js' charset='UTF-8'></script> <script src='http://m.lshqa.cn/wenda/js/semantic.min.js' charset='UTF-8'></script> <script src='http://m.lshqa.cn/wenda/js/vue.js' charset='UTF-8'></script> <link rel='stylesheet' href='http://m.lshqa.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://m.lshqa.cn/wenda/js/login.js' charset='UTF-8'></script> <script src='http://m.lshqa.cn/wenda/js/global.js' charset='UTF-8'></script></body></html>回答2:
全局API系列都必須在實例化之前申明
相關文章:
1. html5 - javascript讀取自定義屬性的值,有的能夠取到,有的取不到怎么回事??2. javascript - 關于微信掃一掃的技術問題3. html - Python2 BeautifulSoup 提取網頁中的表格數據及連接4. python - PyCharm里的一個文件不小心忽略了wx包5. android - VideoView與百度Map沖突6. python - (2006, ’MySQL server has gone away’)7. 小白學python的問題 關于%d和%s的區別8. python - 使用eclipse運行django代碼,修改了views.py這個文件,但是瀏覽器顯示的還是原有沒修改的結果,怎么處理?9. django - pycharm 如何配置 python3 的開發環境?10. win10 Apache24+PHP8.0,Apache不能正常加載php.ini。
