Question

我将treeselect组件作为如下的槽传递。

<template v-slot:filters>
  <treeselect v-model="value" :options="filterTreeData" />
</template>

我的位置如下。

<div class="rule-filter-container">
      <slot name="filters"></slot>
</div>
<div class="rule-operator-container">
  <el-select
    v-if="treeSelect.selectedValue.dataType !== dataType.Checkbox && treeSelect.selectedValue.dataType !== dataType.Radio"
    v-model="value"
    filterable
    placeholder="Type Or Select">
  </el-select>
</div>

如上所述，为了示例，我编写了v-if条件。

目前无法正常工作。但是我想访问treeSelect的选定值。并以此为基础，我希望保留或删除“ el-select”组件。

那么我如何在作为插槽传递的子组件中访问treeselect的选定值？

Answer 1

您应该能够将广告位的值绑定到组件。

<template v-slot:filters :slotValue="value">
  <treeselect v-model="value" :options="filterTreeData" />
</template>

在组件中：

<div class="rule-filter-container">
      <slot name="filters"></slot>
</div>
<div class="rule-operator-container">
  <el-select
    v-if="slotValue !== dataType.Checkbox && slotValue !== dataType.Radio"
    v-model="value"
    filterable
    placeholder="Type Or Select">
  </el-select>
</div>

子组件中的访问插槽值

1 个答案: