el-tree hanya menambah ikon di hadapan nod induk

Bagaimana untuk menambah ikon hanya di hadapan nod induk dalam el-tree?

Untuk menambah ikon secara khusus pada nod induk dalam el-tree, anda boleh menggunakan prop kekunci nod bersama-sama dengan ciri slot berskop yang disediakan oleh Vue.js. Begini cara anda boleh mencapai ini:

<code class="javascript"><template>
  <el-tree :data="treeData">
    <span slot-scope="{ node, data }">
      <i v-if="data.isParent" class="el-icon-folder-opened"></i>
      {{ node.label }}
    </span>
  </el-tree>
</template>

<script>
export default {
  data() {
    return {
      treeData: [
        {
          label: 'Parent Node 1',
          children: [
            { label: 'Child Node 1' },
            { label: 'Child Node 2' },
          ],
        },
        {
          label: 'Parent Node 2',
          children: [
            { label: 'Child Node 3' },
            { label: 'Child Node 4' },
          ],
        },
      ],
    };
  },
};
</script></code>

Adakah mungkin untuk mengehadkan peletakan ikon kepada nod induk dalam el-tree?

Ya, adalah mungkin untuk mengehadkan peletakan ikon kepada nod induk dalam el-tree dengan menggunakan isParent harta. Sifat ini tersedia dalam slot berskop yang disediakan oleh Vue.js untuk setiap nod dalam pepohon.isParent property. This property is available within the scoped slot provided by Vue.js for each node in the tree.

What is the correct syntax to add icons specifically to parent nodes in el-tree?

The correct syntax to add icons specifically to parent nodes in el-tree is as follows:

<code class="html"><span slot-scope="{ node, data }">
  <i v-if="data.isParent" class="el-icon"></i>
  {{ node.label }}
</span></code>

In this syntax, you use the data.isParent condition to check if the current node is a parent node. If it is, you can add an icon using the <i>

Atas ialah kandungan terperinci el-tree hanya menambah ikon di hadapan nod induk. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!