学习分享,共勉
题外话,毕竟我工作多年,深知技术改革和创新的方向,Flutter作为跨平台开发技术、Flutter以其美观、快速、高效、开放等优势迅速俘获人心
开源分享:【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】
vue 三种传值方法
话不多说,直接撰写
第一种:父传子
父:
<template>
<div> 父组件: <input type="text" v-model="val">(v-model双向绑定)
<!-- 这里是引入子组件 -->
<child :inputName="name"></child> </div>
</template>
<script>
import child from './child'
export default {
components: { child },
data () {
return {
val: ''
}
}
}
</script>
子组件
<template>
<div> 子组件: <span>{{inputName}}</span> </div>
</template>
<script>
export default {
// 接受父组件的值
props: {
inputName: String,
required: true
}
}
子传父
子:
<template>
<div> 子组件: <span>{{childValue}}</span> <!-- 定义一个子组件传值的方法 --> <input type="button" value="点击触发" @click="childClick"> </div>
</template>
<script>
export default {
data () {
return {
childValue: '我是子组件的数据'
}
},
methods: {
childClick () {
// childByValue是在父组件on监听的方法 // 第二个参数this.childValue是需要传的值
this.$emit('childByValue', this.childValue)
}
}
}
</script>
父:
<template>
<div> 父组件: <span>{{name}}</span> <br> <br> <!-- 引入子组件 定义一个on的方法监听子组件的状态--> <child v-on:childByValue="childByValue"></child> </div>
</template>
<script>
import child from './child'
**总结**:
* 函数式编程其实是一种编程思想,它追求更细的粒度,将应用拆分成一组组极小的单元函数,组合调用操作数据流;
* 它提倡着 纯函数 / 函数复合 / 数据不可变, 谨慎对待函数内的 状态共享 / 依赖外部 / 副作用;
**[开源分享:【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】](https://bbs.csdn.net/forums/4304bb5a486d4c3ab8389e65ecb71ac0)**
> Tips:
> 其实我们很难也不需要在面试过程中去完美地阐述出整套思想,这里也只是浅尝辄止,一些个人理解而已。博主也是初级小菜鸟,停留在表面而已,只求对大家能有所帮助,轻喷🤣;
>
> 我个人觉得: 这些编程范式之间,其实并不矛盾,各有各的 **优劣势**。
>
> 理解和学习它们的理念与优势,合理地 **设计融合**,将优秀的软件编程思想用于提升我们应用;
> 所有设计思想,最终的目标一定是使我们的应用更加 **解耦颗粒化、易拓展、易测试、高复用,开发更为高效和安全**;
> 我个人觉得: 这些编程范式之间,其实并不矛盾,各有各的 **优劣势**。
>
> 理解和学习它们的理念与优势,合理地 **设计融合**,将优秀的软件编程思想用于提升我们应用;
> 所有设计思想,最终的目标一定是使我们的应用更加 **解耦颗粒化、易拓展、易测试、高复用,开发更为高效和安全**;