Vuejs 实用技巧

1.组件如何通过vue-router传递参数:

这里传递的参数希望不显式的添加在url上面,具体代码如下:

路由配置:

new Router({
  routes: [
    { path: '/', component: Index, name: 'index'},
    { path: '/mv/:id', component: Mplayer, name: 'mv'}
  ]
})

组件一设置参数:

<router-link :to="{ name: 'mv', params: { id: mv.id, poster: mv.cover, mvName: mv.name }}"></router-link>

组件二获取参数:

this.video.poster = this.$route.params.poster;
this.mvDetail.name = this.$route.params.mvName;

2.如何在事件内触发DOM元素的原生事件:

以点击回车键收起手机键盘为例,具体代码如下:

<form @submit.prevent="submit" action="">
  <input type="search" placeholder="搜索" v-model="searchKeyword" @keyup.enter="hideKeyboard($event)">
</form>
hideKeyboard: function(ev){
  ev.target.blur();
}

发表评论

电子邮件地址不会被公开。 必填项已用*标注

您可以使用这些HTML标签和属性: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>