vue之兄弟传值,父子间通信,ref以及axios

1.兄弟传值之总线方式用$bus,$on方式,这个既可以用在兄弟间传值,又可以用在父子间传值,操作步骤如下

第一步:在main.js上new 出一个新的vue实例化对象,挂载到当前使用的vue的原型上并起个属性名叫$bus,见下图

第一步

第二步:在组件childA中使用点击按钮发送childA中的值

第二步

第三步:在childB中,在created的时候,使用当前vue原型上的$bus属性并通过$on来监听自定义事件childV传过来的值,如果传过来了,就把值打印在页面上,并修改自己data中msg的值

第三步

2.父子间通信使用.sync语法糖的形式,步骤如下

子组件可以改变父组件的值

第一步:父组件里在传过来的参数后面加个.sync修饰符

第一步

第二步:在子组件里,在触发点击事件的时候,需要通过$emit在加上第一个参数的“update:参数名”来触发,第二个参数是需要改变的新值

第二步

3.利用ref获取原生dom,点击dom可以修改dom的内容,并且利用$nexttick获取最新的dom内容

在父组件操作子组件的dom元素

第一步:在父组件里的标签上ref,然后设置一个名字

第一步

第二步:在mounted里可以获取子组件childA的dom元素,并可以用原生的方法进行操作

第二步

三,可以使用$nexttick获取最新的dom内容

4.使用axios实现get请求和post请求

第一步:安装axios

第一步

第二步:引入axios

第三步:.get和.post请求

1.简写形式

2.全面配置

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容