用vue的情况下是怎样的

在Vue.js框架下，如果想要控制根节点不响应点击收缩的操作，你可以在组件层次上实现这个需求。这里有一个简单的例子，假设你在使用Vue-Graph库（类似G6的 Vue 版本）创建图形：

首先，你需要安装`vue-graph`库，然后在你的组件中定制节点的组件：

<template>
  <vue-graph ref="graph">
    <custom-node v-for="node in nodes" :key="node.id" :node-data="node" />
  </vue-graph>
</template>

<script>
import { Graph, Node } from 'vue-graph';
import CustomNode from './CustomNode.vue'; // 自定义节点组件

export default {
  components: {
    Graph,
    CustomNode,
  },
  data() {
    return {
      nodes: [
        // 你的节点数据
      ],
    };
  },
};
</script>

<!-- CustomNode.vue -->
<template>
  <div @click.stop>
    <!-- 容易被误认为是节点点击的元素，比如文字或图片 -->
    <div class="node-content">{{ node.content }}</div>
  </div>
</template>

在这个例子中，我们在`CustomNode`组件里添加了`@click.stop`事件阻止默认的点击事件传递到父组件。这样就实现了根节点或其他节点不因点击而收缩的效果。

注意：如果你需要更复杂的自定义逻辑，如仅在某些条件下阻止收缩，可以在`CustomNode`组件内部添加对应的判断逻辑。