动态组件元素在Vue.js中不起作用

Question

I faced a problem which made me mad. 我遇到一个使我生气的问题。 I try to make a dynamic component But it is not work. 我尝试制作一个动态组件，但这是行不通的。 Vue detect my first and second component but it not detect the others. Vue检测到我的第一部分和第二部分，但未检测到其他部分。

this is my index html 这是我的索引html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Kamuran Vue Test</title>
</head>
<body>
    <app-header>
</app-header>
test
    app-header

    <app-header></app-header>

    <component is="{{view}}"></component>


    <app-footer></app-footer>


    <app-form form="login"></app-form>

</body>
<script src="build.js"></script>
</html>

also my main.js 还有我的main.js

var $    = require('jquery')
var page = require('page')
var Vue = require('vue')

var vue = new Vue({
  el: 'html', 
  data: {
    view: 'home'
  },
  components: {
    'app-footer'   :   require('./components/footer'),
    'app-header'   :   require('./components/header'),
    'app-form'     :   require('./components/form'),
    'home'         :   require('./views/home'),
    'login'        :   require('./views/logins'),
    'contact'      :   require('./views/contact')
  } 
});

page("*", function(ctx){
  if(ctx.path != "/"){
    vue.view = ctx.path.substr(1);
  } else {
    vue.view = "home"
  }

  console.log(vue.view)

});
page();

I cant see any error warning about js as building build.js or on console. 我在构建build.js或在控制台上看不到有关js的任何错误警告。

element not work, even though I set its value as app-header. 元素不起作用，即使我将其值设置为应用程序标头也是如此。

app-header and app-footer work perfectly as use them an element but other components not work. app-header和app-footer可以完美地工作，因为它们可以作为元素使用，但其他组件则不起作用。 Is there another package to work them ? 是否有另一个软件包可以工作？

what is go wrong, I do not understand. 怎么了，我不明白。

Answer 1

finally, I found the answer. 终于，我找到了答案。 When I build "build.js" I used browserify. 当我构建“ build.js”时，我使用了browserify。 It caused the problem. 它引起了问题。 Clear all my node modules and re-install them with webpack, then I re build the js file and problem solved. 清除所有节点模块，然后使用webpack重新安装它们，然后重新构建js文件并解决问题。

动态组件元素在Vue.js中不起作用

问题描述

1 个解决方案

解决方案1
1 已采纳 2015-07-28 15:06:47

动态组件元素在Vue.js中不起作用

问题描述

1 个解决方案

解决方案1 1 已采纳 2015-07-28 15:06:47

解决方案1
1 已采纳 2015-07-28 15:06:47