vue项目中，修改引入组件的参数时用/deep/

在 Vue 中，如果你需要修改传递给子组件的参数，同时又希望 Vue 能够检测到这个变化，可以使用 `/deep/` 修饰符来告诉 Vue 将这个参数视为深层对象，从而触发视图的更新。

具体来说，当你使用 `/deep/` 修饰符时，Vue 会将参数的每一层都视为一个响应式对象，这样当你修改参数的某个深层属性时，Vue 就能够检测到这个变化，并且触发视图的更新。

举个例子，假设你有一个父组件 A 和一个子组件 B，你需要将一个对象作为参数传递给子组件 B，如下所示：

<template>
  <div>
    <B :data="obj"></B>
  </div>
</template>

<script>
  import B from './B.vue'

  export default {
    components: {
      B
    },
    data() {
      return {
        obj: {
          name: '张三',
          age: 18
        }
      }
    }
  }
</script>

如果你需要在父组件中修改 `obj` 对象的某个属性，并且希望子组件能够感知到这个变化，可以使用 `/deep/` 修饰符，如下所示：

<template>
  <div>
    <B :data/deep/="obj"></B>
  </div>
</template>

<script>
  import B from './B.vue'

  export default {
    components: {
      B
    },
    data() {
      return {
        obj: {
          name: '张三',
          age: 18
        }
      }
    },
    methods: {
      changeName() {
        this.$set(this.obj, 'name', '李四')
      }
    }
  }
</script>

在这个例子中，我们在父组件中使用 `/deep/` 修饰符来传递 `obj` 对象给子组件 B，这样当我们在父组件中修改 `obj` 对象的 `name` 属性时，子组件 B 就能够感知到这个变化，并且触发视图的更新。注意，我们在修改 `obj` 对象时使用了 `$set` 方法来触发更新，而不是直接赋值。