vue中实例如何给组件传值？

Question

有个需求
topbar封装成了组件
然后希望在不同页面使用的时候传一个值进去

Page.html:
<div class="page" id="product_list_page">
            <!-- 标题栏 -->
            <headbar :keywordMode="mode"></headbar>
</div>
new Vue({
el: '#product_list_page',
data: {
    mode:1
}
});

Component.js    
var HeadBar = Vue.extend({
  props: {
      keywordMode: {   // 可选字段，有默认值
        default: 0
      }
    },
  template: '...'
});
Vue.component('headbar', HeadBar);

但是组件部分就获取不了这个html实例传的值..请问要怎么做？

Answer 1

Vue组件props传递时有个驼峰格式的转化

<headbar :keyword-mode="mode"></headbar>

参考：http://vuejs.org/guide/compon...