fix: 4.0测试期间发现的问题3.0同步修改 (#2055)

src/packages/__VUE/comment/components/CmtBottom.vue

@@ -1,7 +1,7 @@
 <template>
   <view class="nut-comment-bottom">
     <view @click="handleClick" class="nut-comment-bottom__lable">
-      <span v-if="type != 'complex'">{{ info.size }}</span></view
+      <span v-if="type != 'complex'" style="display: inline">{{ info.size }}</span></view
     >
 
     <view class="nut-comment-bottom__cpx">

src/packages/__VUE/comment/demo.vue

@@ -6,7 +6,6 @@
         :images="cmt.images"
         :videos="cmt.videos"
         :info="cmt.info"
-        :labels="labels"
         @click="handleclick"
         @clickImages="clickImages"
         :operation="['replay']"
@@ -48,7 +47,7 @@
       </nut-comment>
     </nut-cell>
 
-    <h2>{{ translate('additionalReview') }}</h2>
+    <h2>{{ translate('additionalReviewN') }}</h2>
     <nut-cell>
       <nut-comment
         imagesRows="multi"
@@ -73,7 +72,7 @@ const initTranslate = () =>
       basic: '基本用法',
       single: '评论图片单行展示',
       multiRow: '评论图片多行展示',
-      additionalReview: '追评展示'
+      additionalReviewN: '追评展示'
     },
     'en-US': {
       basic: 'Basic Usage',
@@ -88,9 +87,6 @@ export default createDemo({
   setup() {
     initTranslate();
     let cmt = ref({});
-    const labels = () => {
-      return '<nut-icon name="dongdong" color="#fa2c19"></nut-icon>';
-    };
 
     const handleclick = (info: any) => {
       console.log('进行跳转', info);
@@ -115,7 +111,6 @@ export default createDemo({
 
     return {
       cmt,
-      labels,
       handleclick,
       clickImages,
       translate

src/packages/__VUE/comment/index.taro.vue

@@ -1,7 +1,7 @@
 <template>
   <view :class="classes" v-if="info && Object.keys(info)">
     <!-- 根据展示信息的多少，分为3种展示风格：simple，base，complex -->
-    <comment-header :type="headerType" :info="info" :labels="labels" @handleClick="handleClick">
+    <comment-header :type="headerType" :info="info" @handleClick="handleClick">
       <template #labels>
         <slot name="comment-labels"></slot>
       </template>
@@ -36,7 +36,7 @@
       @handleClick="handleClick"
     ></comment-bottom>
 
-    <slot name="cmt-shop-reply"></slot>
+    <slot name="comment-shop-reply"></slot>
   </view>
 </template>
 <script lang="ts">
@@ -84,11 +84,6 @@ export default create({
       default: () => {}
     },
 
-    labels: {
-      type: Function,
-      default: () => ''
-    },
-
     operation: {
       type: Array,
       default: ['replay', 'like', 'more']

src/packages/__VUE/comment/index.vue

@@ -1,7 +1,7 @@
 <template>
   <view :class="classes" v-if="info && Object.keys(info)">
     <!-- 根据展示信息的多少，分为3种展示风格：simple，base，complex -->
-    <comment-header :type="headerType" :info="info" :labels="labels" @handleClick="handleClick">
+    <comment-header :type="headerType" :info="info" @handleClick="handleClick">
       <template #labels>
         <slot name="comment-labels"></slot>
       </template>
@@ -84,11 +84,6 @@ export default create({
       default: () => {}
     },
 
-    labels: {
-      type: Function,
-      default: () => ''
-    },
-
     operation: {
       type: Array,
       default: ['replay', 'like', 'more']

src/packages/__VUE/datepicker/doc.en-US.md

@@ -43,8 +43,8 @@ app.use(OverLay);
     setup(props) {
       const show = ref(false);
       const desc = ref('2022-05-10');
-      const minDate = new Date(2020, 0, 1),
-      const maxDate = new Date(2025, 10, 1),
+      const minDate = new Date(2020, 0, 1);
+      const maxDate = new Date(2025, 10, 1);
       const currentDate = new Date(2022, 4, 10, 10, 10);
       const confirm = ({ selectedValue, selectedOptions })=>{
         desc.value = selectedOptions.map((option) => option.text).join('');
@@ -379,7 +379,7 @@ app.use(OverLay);
 | ok-text           | Text of confirm button                                      | String  | confirm   |
 | cancel-text           | Text of cancel button                                          | String  | cancel   |
 | three-dimensional  `v3.1.23`          | Turn on 3D effects               | Boolean  | true   |
-| swipe-duration `v3.2.2`          | Duration of the momentum animation        | Number、String  | 1000   |
+| swipe-duration `v3.2.2`          | Duration of the momentum animation        | Number \| String  | 1000   |
 | safe-area-inset-bottom `v3.2.4`	| Whether to enable iPhone series full screen bottom safety zone adaptation, which is only valid when `position` is  `bottom` |	Boolean	|`false`     |
 
 ### Events

src/packages/__VUE/datepicker/doc.md

@@ -43,8 +43,8 @@ app.use(OverLay);
     setup(props) {
       const show = ref(false);
       const desc = ref('2022年05月10日');
-      const minDate = new Date(2020, 0, 1),
-      const maxDate = new Date(2025, 10, 1),
+      const minDate = new Date(2020, 0, 1);
+      const maxDate = new Date(2025, 10, 1);
       const currentDate = new Date(2022, 4, 10, 10, 10);
       const confirm = ({ selectedValue, selectedOptions })=>{
         desc.value = selectedOptions.map((option) => option.text).join('');
@@ -388,7 +388,7 @@ DatetimePicker 通过 type 属性来定义需要选择的时间类型。将 type
 | ok-text           | 确定按钮文案                                          | String  | 确定   |
 | cancel-text           | 取消按钮文案                                          | String  | 取消   |
 | three-dimensional `v3.1.23`          | 是否开启3D效果               | Boolean  | true   |
-| swipe-duration `v3.2.2`          | 惯性滚动时长               | Number、String  | 1000    |
+| swipe-duration `v3.2.2`          | 惯性滚动时长               | Number \| String  | 1000    |
 | safe-area-inset-bottom `v3.2.4`	| 是否开启 iphone 系列全面屏底部安全区适配,仅当 `position` 为 `bottom` 时有效 |	Boolean	|`false`     |
 
 ### Events

src/packages/__VUE/ellipsis/index.vue

@@ -77,9 +77,6 @@ export default create({
       () => props.content,
       (newV, oldVal) => {
         if (newV != oldVal) {
-          if (container) {
-            document.body.appendChild(container);
-          }
           createContainer();
         }
       }
@@ -125,6 +122,7 @@ export default create({
     const calcEllipse = () => {
       if (container.offsetHeight <= maxHeight) {
         state.exceeded = false;
+        document.body.removeChild(container);
       } else {
         state.exceeded = true;
         const end = props.content.length;

src/packages/__VUE/noticebar/index.scss

@@ -62,6 +62,7 @@
     position: absolute;
     white-space: nowrap;
     &.nut-ellipsis {
+      display: inline-block;
       max-width: 100%;
       white-space: nowrap;
       overflow: hidden;

src/packages/__VUE/noticebar/index.vue

@@ -56,12 +56,9 @@
       </template>
 
       <view class="go" @click="!slots.rightIcon && handleClickIcon()">
-        <template v-if="slots.rightIcon">
-          <slot name="rightIcon"></slot>
-        </template>
-        <template v-else-if="closeMode">
-          <nut-icon type="cross" :color="color" size="11px"></nut-icon>
-        </template>
+        <slot name="rightIcon">
+          <nut-icon type="cross" v-if="closeMode" :color="color" size="11px"></nut-icon>
+        </slot>
       </view>
     </view>
   </view>

src/packages/__VUE/picker/Column.vue

@@ -131,6 +131,8 @@ export default create({
         }
       }
 
+      preventDefault(event, true);
+
       state.touchParams.startY = touch.deltaY.value;
       state.touchParams.startTime = Date.now();
       state.transformY = state.scrollDistance;

src/packages/__VUE/picker/common.ts

@@ -235,6 +235,8 @@ export const componentWeapp = {
         // 选择的是哪个 option
         changeHandler(changeIndex, columnsList.value[changeIndex][data.detail.value[changeIndex]]);
       }
+
+      defaultIndexes.value = defaultValuesConvert();
     };
 
     // 确定

src/packages/__VUE/picker/index.taro.vue

@@ -31,7 +31,6 @@
         indicator-style="height: 34px;"
         :value="defaultIndexes"
         style="width: 100%; height: 252px"
-        :immediate-change="true"
         @change="tileChange"
         @pickstart="handlePickstart"
         @pickend="handlePickend"

src/packages/__VUE/sku/components/SkuHeader.vue

@@ -1,6 +1,9 @@
 <template>
   <view class="nut-sku-header">
-    <img :src="goods.imagePath" />
+    <!-- <img :src="goods.imagePath" /> -->
+    <image class="nut-sku-header-img" :src="goods.imagePath" v-if="ENV != ENV_TYPE.WEB" />
+    <img class="nut-sku-header-img" :src="goods.imagePath" v-else />
+
     <view class="nut-sku-header-right">
       <template v-if="getSlots('sku-header-price')">
         <slot name="sku-header-price"></slot>
@@ -17,10 +20,10 @@
   </view>
 </template>
 <script lang="ts">
-import { ref, watch, onMounted } from 'vue';
-
+import { reactive, toRefs, onMounted } from 'vue';
 import { createComponent } from '@/packages/utils/create';
 const { componentName, create, translate } = createComponent('sku-header');
+import Taro from '@tarojs/taro';
 
 export default create({
   props: {
@@ -34,9 +37,15 @@ export default create({
   setup(props: any, { emit, slots }) {
     const getSlots = (name: string) => slots[name];
 
+    const state = reactive({
+      ENV: Taro.getEnv(),
+      ENV_TYPE: Taro.ENV_TYPE
+    });
+
     return {
       getSlots,
-      translate
+      translate,
+      ...toRefs(state)
     };
   }
 });

src/packages/__VUE/sku/index.scss

@@ -50,7 +50,7 @@
     flex-shrink: 0;
     margin-top: 18px;
     padding: 0 18px;
-    > img {
+    .nut-sku-header-img {
       width: $sku-product-img-width;
       height: $sku-product-img-height;
       flex-shrink: 0;

src/sites/mobile-taro/vue/src/business/pages/comment/index.vue

@@ -6,7 +6,6 @@
         :images="cmt.images"
         :videos="cmt.videos"
         :info="cmt.info"
-        :labels="labels"
         @click="handleclick"
         @clickImages="clickImages"
         :operation="['replay']"
@@ -42,7 +41,7 @@
 
         <template #comment-shop-reply>
           <div class="nut-comment-shop">
-            <span>京东美妆国际：</span
+            <span style="display: inline">京东美妆国际：</span
             >尊敬的客户您好，非常抱歉给您带来不愉快的购物体验，关于过敏，什么成分都不存在个别性和普遍性。
           </div>
         </template>
@@ -69,10 +68,6 @@ export default defineComponent({
   props: {},
   setup() {
     let cmt = ref({});
-    const labels = () => {
-      return '<nut-icon name="dongdong" color="#fa2c19"></nut-icon>';
-    };
-
     const handleclick = (info: any) => {
       console.log('进行跳转', info);
     };
@@ -97,7 +92,6 @@ export default defineComponent({
 
     return {
       cmt,
-      labels,
       handleclick,
       clickImages
     };