Web前端最全Vue进阶（九十四）：自定义组件_前端 自定义组件(1)，字节跳动前端面试全套真题解析在互联网火了

算法刷题

大厂面试还是很注重算法题的，尤其是字节跳动，算法是问的比较多的，关于算法，推荐《LeetCode》和《算法的乐趣》，这两本我也有电子版，字节跳动、阿里、美团等大厂面试题（含答案+解析）、学习笔记、Xmind思维导图均可以分享给大家学习。

开源分享：【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】

写在最后

最后，对所以做Java的朋友提几点建议，也是我的个人心得：

1. 疯狂编程

2. 学习效果可视化

3. 写博客

4. 阅读优秀代码

5. 心态调整

在 `props` 中接收数据，注意`props`对象里面 **键值** 是对该接收数据的 **数据类型** 的规定。做了规范，使用者就只能传输指定类型的数据，否则将警告。


而`props`对象中的数据，我们可以直接在当前组件中使用 `this.searchList`直接使用。这里要强调一下，`props`传过来的数据只做展示，不得修改，想修改，再新写一个`data`中的变量承接做数据的再处理。


#### 3.2 emit 的使用


前面实现了父组件向子组件传递数据，那子组件如何来修改父组件的数据呢？


这里提供 2 种实现方法，但是 第一种不推荐，强烈不推荐！


方式一：

selectValue: {
data: ‘1’
},
　　　…
this.selectValue.data = ‘我被修改了’

即，父组件将对象数据传递给子组件，子组件直接修改`props`过来的对象的值。


该方式可以实现子组件快速修改父组件的值，但是越权了！不推荐，这种方式写多了，容易出错，特别是多层组件嵌套的时候。这种修改对代码的迭代和错误的捕捉都不友好，所以建议大家别这样写。


实现原理简单提一下： 这个对象、数组，是引用数据类型，就是存储单元的信息是指针，真正数据在别的地方，通过指针查询的数据，所以这样写，对浏览器来说仅仅是传递了一个指针，数据还是同一份数据。所以你能修改。


方式二：


通过 `$emit()` 去调用父组件的方法，在父组件中修改`data`的数据。（根正苗红的方法，规范写法）

// 子组件
this.$emit(‘selectFunc’, value)
// 父组件
<search @selectFunc=“selectFunc” :searchList=“searchList” :selectValue=“selectValue”>

selectFunc(value) {
this.selectValue2 = value
console.log(this.selectValue)
console.log(this.selectValue2)
}

将父组件的方法注入子组件 `@selectFunc="selectFunc"` ，然后在子组件中通过 `$emit` 调用，并传递参数，达到修改目的。


### 四、Demo


父组件：

子组件：

{{item}}

### 五、属性介绍


`<template>` 为`HTML5`发布后用来声明“模板元素”的标签。即`HTML5`之前使用`<script type ="text/template">`方式声明，而`HTML5`之后可用`<template>` 标签。


### 六、全局组件与局部组件


#### 6.1 全局组件挂载


在`main.js`中全局注册到`vue`中。

import MyBread from ‘@/components/common/MyBread.vue’
Vue.component(“MyBread”, MyBread);//全局自定义组件

在需要需要引入的父组件中可以直接使用，

#### 6.2 局部组件挂载


在需要需要引入的父组件中。

import MyBread from ‘@/components/common/MyBread.vue’
components: { MyBread }

在需要的组件中可以直接使用，

后话

---

开源分享：【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】

对于面试，说几句个人观点。

面试，说到底是一种考试。正如我们一直批判应试教育脱离教育的本质，为了面试学习技术也脱离了技术的初心。但考试对于人才选拔的有效性是毋庸置疑的，几千年来一直如此。除非你有实力向公司证明你足够优秀，否则，还是得乖乖准备面试。这也并不妨碍你在通过面试之后按自己的方式学习。
其实在面试准备阶段，个人的收获是很大的，我也认为这是一种不错的学习方式。首先，面试问题大部分基础而且深入，这些是平时工作的基础。就好像我们之前一直不明白学习语文的意义，但它的意义就在每天的谈话间。

所谓面试造火箭，工作拧螺丝。面试往往有更高的要求，也迫使我们更专心更深入地去学习一些知识，也何尝不是一种好事。