vue中的组件,Component元素,自定义路由,异步数据获取

本文详细介绍了Vue.js中组件的开发过程,包括组件的注册、属性传递以及父子组件通信。同时,讨论了Component元素的使用,以及如何自定义路由规则来切换组件。此外,还探讨了在组件中如何处理异步数据,特别是在组件创建后通过`created`钩子进行数据获取。
摘要由CSDN通过智能技术生成

组件是Vue最强大的功能之一。
组件是一组可被复用的具有一定功能,独立的完整的代码片段,这个代码片段可以渲染一个完整视图结构
组件开发
如何注册组件?
第一步,在页面HTML标签中使用这个组件名称,像使用DOM元素一样。(通常是一个自定义元素)。
<div id="app">
  <my-component></my-component>
</div>
第二步,使用Vue.extend方法创建一个组件
var MyComponent = Vue.extend({
  // .........
})
在extend方法中接收一个对象.
这个对象是一个描述组件的对象,它具有Vue实例化对象上的属性方法,它还有一些特殊的属性
template:组件内部渲染模的板字符串
props:父组件向组件内部传入数据的引用
<div id="app">
  <input type="text" v-model="inputVal"/>
  <my-component msg="you" v-bind:inputtext="inputVal"></my-component> 
</div>
想在template里用这个msg和inputVal
组件内部还没有这个msg和inputVal
v-bind是为了创造个js环境
所以将组件中的属性值引入组件内部通过props属性

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值