白色主题

miniprogram_npm/tdesign-miniprogram/image/README.md

@@ -6,6 +6,7 @@ isComponent: true
 ---
 
 <span class="coverages-badge" style="margin-right: 10px"><img src="https://img.shields.io/badge/coverages%3A%20lines-100%25-blue" /></span><span class="coverages-badge" style="margin-right: 10px"><img src="https://img.shields.io/badge/coverages%3A%20functions-100%25-blue" /></span><span class="coverages-badge" style="margin-right: 10px"><img src="https://img.shields.io/badge/coverages%3A%20statements-100%25-blue" /></span><span class="coverages-badge" style="margin-right: 10px"><img src="https://img.shields.io/badge/coverages%3A%20branches-100%25-blue" /></span>
+
 ## 引入
 
 全局引入，在 miniprogram 根目录下的`app.json`中配置，局部引入，在需要引入的页面或组件的`index.json`中配置。
@@ -26,6 +27,19 @@ isComponent: true
 
 {{ status }}
 
+## 常见问题
+
+<details>
+  <summary>
+    本地图片无法正确引用?
+    <span class="icon">👇</span>
+  </summary>
+  <p style="margin-top: 10px; color: rgba(0, 0, 0, .6)">
+    建议使用绝对路径，而不是相对路径。绝对路径以 app.json 所在位置为基准。
+  </p>
+</details>
+
+
 ## API
 ### Image Props
 

miniprogram_npm/tdesign-miniprogram/image/image.js

@@ -7,7 +7,7 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
 import { SuperComponent, wxComponent } from '../common/src/index';
 import ImageProps from './props';
 import config from '../common/config';
-import { addUnit } from '../common/utils';
+import { addUnit, getRect } from '../common/utils';
 const { prefix } = config;
 const name = `${prefix}-image`;
 let Image = class Image extends SuperComponent {
@@ -59,15 +59,11 @@ let Image = class Image extends SuperComponent {
                     (versionArray[0] === 2 && versionArray[1] === 10 && versionArray[2] < 3);
                 if (mode === 'heightFix' && isInCompatible) {
                     const { height: picHeight, width: picWidth } = e.detail;
-                    const query = this.createSelectorQuery();
-                    query
-                        .select('#image')
-                        .boundingClientRect((res) => {
-                        const { height } = res;
+                    getRect(this, '#image').then((rect) => {
+                        const { height } = rect;
                         const resultWidth = ((height / picHeight) * picWidth).toFixed(2);
                         this.setData({ innerStyle: `height: ${addUnit(height)}; width: ${resultWidth}px;` });
-                    })
-                        .exec();
+                    });
                 }
                 this.setData({
                     isLoading: false,

miniprogram_npm/tdesign-miniprogram/image/image.wxml

@@ -1,7 +1,7 @@
 <!-- 加载中占位 -->
 <view
   wx:if="{{isLoading}}"
-  style="{{innerStyle}} {{customStyle}}"
+  style="{{innerStyle}} {{style}}"
   class="{{prefix}}-class {{classPrefix}} {{classPrefix}}__mask {{classPrefix}}--loading {{classPrefix}}--shape-{{shape}}"
   aria-hidden="{{ariaHidden}}"
 >
@@ -11,7 +11,7 @@
     size="44rpx"
     loading
     inherit-color
-    class="t-class-load"
+    t-class="t-class-load"
     t-class-text="{{classPrefix}}--loading-text"
   ></t-loading>
   <view wx:elif="{{loading !== 'slot' && loading !== ''}}" class="{{classPrefix}}__common {{prefix}}-class-load">
@@ -22,7 +22,7 @@
 <!-- 加载失败占位 -->
 <view
   wx:elif="{{isFailed}}"
-  style="{{innerStyle}} {{customStyle}}"
+  style="{{innerStyle}} {{style}}"
   class="{{prefix}}-class {{classPrefix}} {{classPrefix}}__mask {{classPrefix}}--failed {{classPrefix}}--shape-{{shape}}"
   aria-hidden="{{ariaHidden}}"
 >
@@ -38,7 +38,7 @@
   hidden="{{isLoading || isFailed}}"
   class="{{prefix}}-class {{classPrefix}} {{classPrefix}}--shape-{{shape}}"
   src="{{src}}"
-  style="{{innerStyle}}{{customStyle}}"
+  style="{{innerStyle}}{{style}}"
   mode="{{mode}}"
   webp="{{webp}}"
   lazy-load="{{lazy}}"

miniprogram_npm/tdesign-miniprogram/image/props.js

@@ -1,5 +1,5 @@
 const props = {
-    customStyle: {
+    style: {
         type: String,
         value: '',
     },

miniprogram_npm/tdesign-miniprogram/image/type.d.ts

@@ -1,5 +1,5 @@
 export interface TdImageProps {
-    customStyle?: {
+    style?: {
         type: StringConstructor;
         value?: string;
     };