Code Monkey home page Code Monkey logo

Comments (3)

idux-bot avatar idux-bot commented on July 17, 2024

Translation of this issue:

[Xupload] Under the default configuration, the download button in the list slot cannot be displayed

REPRODUCTION LINK

[link] (https://playground.idux.site/#eyjqbgf5z3jvdw5kqxbwlnz1zSi6ijx0ZW1WBGF0ZT5CBIAGPEL4RHD2VDMLKZXI +xg4g 4TM90A Wzpy2f0aw9uuhjvdmlkzxi+xg4gicagica8sxhnb2rhbfbyb3zgvyPlxuicagicAgicAgicAgica8sxhnzywdluhjvdmlkzxi+XG4GICAGAGPEFWCCAVPLXU ICAGICAGICA8L0L0L4TWVZC2FNZVBYB3ZPZGVYPLXUICAGICAGPC9jee1vzgfsuhjvdmlkzxi+XG4GICAGPC9jee5vdglmdglVBLXPLXUICA8L0L0L0L0L0L 4RHJHD2VYUHJVDMLKZXI+XG48L3RLBXBSYXRLPLXUXG48C2NYAXB0IGXHBMC9XCJ0C1wiihhnldhvwPlxuaw1wb3j0iHSGC2V0DXIH0GZBSANLI9ZZXR 1CELKDXGUANMNXG5PBXBVCNQGQXBWIGZYB20GJY4VQXBWLNZ1ZSDCBNNLDHVWR1ECGPXG48L3NNNNLWDD5CBIISISIK52DGVTCGXHDGU+XG4GIDXJJ EFVWBG9HZCB2LB2LB2LBZGVSOMZPBGVZPVWIZMLSZXNCIIBHY3RPB249XCJODHRWCZL3J1BI5TB2NR LHZTMZNTRCIJ5CBIAGICA8SXHCDXR0B24+VXBSB2FKPC9jej1DHRVBJ5CBIAGICA8DGVTCGXHDGUGI2XPC3Q+XG4GICGXHVCGXVYWRCYBAZG93B93B MXVYWQ9XCJKBFILZ5CBIAGICA8L3RLBXBSYXRLPLXUICA8L4VXBSBSB2FKPLXUICBCBIAGA8SXHVCGXWQGDPMAWXLCZ1CIMZZXCIGYWN0N0 AW9UPVWIHR0CHM6LY9YDW4UBW9JA3KUAW8VDJMVNZU2NGJJNGYTNZS00M2Y3LWJJNTGTNDY3LWUZMZU0XCI+XG4GICAGPEL4QNVWBBG9Hzdwvs XHCDXR0B24+XG4GICAGPHRLBXBSYXRLICNSAXN0PLXUICAGPEL4VXBSB2FKRMLSZMGQGRVD25SB2FKPVWNVBJ1CIMLJB25CII8+XG4GICAGP C90ZW1WBGF0ZT5CBIAGPC9jefvWBG9Hzd5CBJWVDGVTCGXHDGU+XG5CBJXZY3JPCHQGC2V0DXAGBGFUZZ1CINRZXCI+XG5PBXBCNQGFSBMCM9TICD2D Wunxg5cbmnvbnvn0igzpbgvzid0cmvmvmkFTCBIAGE1XUICAGTLETOGJ3RC3QXJYXCBIAGICBUYW1LOIANAWR1EC5ZDMCNLFXR1CZOGJ3NLC3 Mnlfxuicb9lfxSLCBMNVBNBNN0IGLJB24GPSB7ZG93BMXVYWQ6icdkb3Dubg9Hzcd9xg5cbmnnnn0igrsid0gkkge1xuGXUFVXUPC9ZY 3jpchq+xg4ifq ==)

STEPS To Reproduce

What is exfected?

Show the download button

What is actually happy?

Do not display the download button

ENVIRONMENT Info

ANY Additional Comments? (Optional)

The default configuration is not download icon
https://github.com/iduxfe/idux/blob/b03eadde3c9a119EAD5F440AC96FC5EE03E5DB7B/packages/Comfig/defaultConfig.ts#L416 -L424
https://github.com/iduxfe/idux/blob/b03eadde3c9a119EAD5F440AC96FC5EE03E5DB7B7B7B7B/packages/compload/Src/UTILS/ICON.TS#L60-L60-l6 4

from idux.

threedayAAAAA avatar threedayAAAAA commented on July 17, 2024

因为现在按钮处于file状态,你配置file状态的icon就好了

<template>
  <IxUpload v-model:files="files" action="https://run.mocky.io/v3/7564bc4f-780e-43f7-bc58-467959ae3354">
    <IxButton>Upload</IxButton>
    <template #list>
      <IxUploadFiles @download="dl"/>
    </template>
  </IxUpload>
  <!-- <IxUploadFiles @download="dl" :icon="icon"/> -->
  <IxIcon name="download" />
    <IxUpload v-model:files="files" action="https://run.mocky.io/v3/7564bc4f-780e-43f7-bc58-467959ae3354">
    <IxButton>Upload</IxButton>
    <template #list>
      <IxUploadFiles @download="dl" :icon="icon"/>
    </template>
  </IxUpload>
</template>

<script setup lang="ts">
import { ref } from 'vue'

const files = ref([
  {
    key: 'test1',
    name: 'idux.svg',
    status: 'success',
  },
])
const icon = {
  file: 'download',
}
const dl = () => {
  alert(1)
}
</script>

from idux.

dabuside avatar dabuside commented on July 17, 2024

因为现在按钮处于file状态,你配置file状态的icon就好了

<template>
  <IxUpload v-model:files="files" action="https://run.mocky.io/v3/7564bc4f-780e-43f7-bc58-467959ae3354">
    <IxButton>Upload</IxButton>
    <template #list>
      <IxUploadFiles @download="dl"/>
    </template>
  </IxUpload>
  <!-- <IxUploadFiles @download="dl" :icon="icon"/> -->
  <IxIcon name="download" />
    <IxUpload v-model:files="files" action="https://run.mocky.io/v3/7564bc4f-780e-43f7-bc58-467959ae3354">
    <IxButton>Upload</IxButton>
    <template #list>
      <IxUploadFiles @download="dl" :icon="icon"/>
    </template>
  </IxUpload>
</template>

<script setup lang="ts">
import { ref } from 'vue'

const files = ref([
  {
    key: 'test1',
    name: 'idux.svg',
    status: 'success',
  },
])
const icon = {
  file: 'download',
}
const dl = () => {
  alert(1)
}
</script>

是idux配置里面,默认值少配置了属性导致的。
理想情况下,应该显示file icon + 右侧 关闭 icon 以及 下载 icon

from idux.

Related Issues (20)

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.