子组件更新父组件的值

子组件可以通过调用父组件传递的方法来更新父组件的值。在子组件中，可以使用`this.$emit`方法触发一个自定义事件，并将需要传递给父组件的新值作为参数传递给该方法。在父组件中，可以通过在子组件标签上使用`@`符号绑定自定义事件，并在对应的方法中更新父组件的值。

例如，在子组件中定义了一个方法`changeData`，当点击按钮时调用该方法，并通过`this.$emit("changeComponent1Data", 1)`触发自定义事件`changeComponent1Data`，并传递新值1给父组件。在父组件中，可以在子组件标签上使用`@changeComponent1Data`绑定该自定义事件，并在对应的方法中更新父组件的值。

具体代码如下所示：

<!-- 父组件引用子组件 -->
<CateSelect :cate-id="form.categoryId" style="width: 370px;" @changeCate="changeCate" />

<!-- 子组件代码 -->
<template>
  <div style="border: 1px dashed red">
    <h1>this is component2</h1>
    <!-- 直接使用接受到的值 -->
    <h2>我是子组件接收到的父组件的data：我现在在子组件里面{{data}}</h2>
    <!-- 绑定要求改变父组件值的事件 -->
    <el-button type="primary" @click="changeData">点我改变父组件的值</el-button>
  </div>
</template>

<script>
export default {
  name: "component2",
  components: {},
  props: {
    // 接收父组件传来的值
    data: Number
  },
  data() {
    return {}
  },
  methods: {
    /**
     * 通过方法请求给父组件改变值
     */
    changeData() {
      this.$emit("changeComponent1Data", 1)
    }
  }
}
</script>

<style scoped>
</style>

在父组件中，可以定义一个方法`changeCate`来接收子组件传递的新值，并在该方法中更新父组件的值。例如，可以使用`this.form.categoryId = val`来更新父组件的值。

请注意，子组件只能通过调用父组件传递的方法来更新父组件的值，而不能直接修改父组件传递的prop值，否则会引发警告。这是为了确保单向下行绑定的特性，防止子组件意外改变父组件的值。