1234567891011121314151617181920212223242526272829303132333435 |
- <template>
- <fr-svg @click="onClick" :uuid="`fr-icon-tiktok-${size}${strokeWidth}${theme}${fill}${strokeLinecap}${strokeLinejoin}`" :width="size" :height="size" :isCache="true" :src="iconSvg" />
- </template>
- <script>
- // #ifdef UNI-APP-X
- import icons from "../../mixins/icons.uts";
- // #endif
- // #ifndef UNI-APP-X
- import icons from "../../mixins/icons.js";
- // #endif
- /**
- * @description 《抖音》图标
- * @tutorial https://www.flowerui.com/documents/flower-icons/icons.html
- * @property {Number} size 图标大小
- * @property {Number} strokeWidth 线段粗细
- * @property {String} theme 图标大小
- * @property {Array} fill 图标颜色,["外部描边颜色","外部填充颜色","内部描边颜色","内部填充颜色"]
- * @property {String} strokeLinecap 图标大小
- * @property {String} strokeLinejoin 图标大小
- * @event {Function} click 图标点击事件
- */
- export default {
- mixins: [icons],
- computed: {
- // #ifdef UNI-APP-X
- iconSvg(): string {
- // #endif
- // #ifndef UNI-APP-X
- iconSvg() {
- // #endif
- return `<?xml version="1.0" encoding="UTF-8"?><svg width="${this.size}" height="${this.size}" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M21.358 19.1399C15.4694 18.8558 11.3762 20.9553 9.07838 25.4384C5.63169 32.163 8.48026 43.1666 19.9788 43.1666C31.4774 43.1666 31.81 32.0554 31.81 30.8914C31.81 30.1154 31.81 25.7764 31.81 17.8746C34.2694 19.4323 36.343 20.37 38.0308 20.6877C39.7186 21.0053 40.7915 21.1461 41.2497 21.11V14.6343C39.6886 14.4461 38.3386 14.0873 37.1997 13.5581C35.4913 12.7643 32.1037 10.5611 32.1037 7.33208C32.106 7.34787 32.106 6.51493 32.1037 4.83325H24.9857C24.9645 20.6493 24.9645 29.3353 24.9857 30.8914C25.0175 33.2255 23.2068 36.4905 19.5355 36.4905C15.8642 36.4905 14.0535 33.2281 14.0535 31.1239C14.0535 29.8357 14.496 27.9685 16.3251 26.5858C17.4098 25.7658 18.9153 25.4384 21.358 25.4384C21.358 24.6828 21.358 22.5833 21.358 19.1399Z" fill="${this.colors(1)}" stroke="${this.colors(0)}" stroke-width="${this.strokeWidth}" stroke-linejoin="${this.strokeLinejoin}"/></svg>`
- }
- }
- }
- </script>
|