vuex state 实现组件间传值

本文介绍了如何通过Vuex来简化组件间状态传递,通过`npm add vuex`安装Vuex并在store.js中定义state。然后在组件中使用mapState辅助函数减少返回state值的代码。以一个实际案例展示:组件一点击确定将输入框内容传递给组件二。
摘要由CSDN通过智能技术生成

npm add vuex 下载vuex

store.js:

import Vue from 'vue'
import Vuex from 'vuex'

Vue.use(Vuex)

export default new Vuex.Store({
   
	state:{
   
		name:jing,
		age:18,
		look:beautiful
	},
	mutations:{
   },
	actions:{
   }
})

组件一:

<div>
	name:{
  {username}}
	<button @click="add"> 确认</button>
</div>
data(){
   
	return(){
   
		//注意 写在data中,因为先赋值给了username,那么sto
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值