refactor(Sku): rename largePicturePreview to largeImageMode

src/sku/components/SkuRow.js

@@ -8,7 +8,7 @@ const [createComponent, bem, t] = createNamespace('sku-row');
 export default createComponent({
   mixins: [
     BindEventMixin(function (bind) {
-      if (!(this.largePicturePreview && this.hasScrollTab)) {
+      if (!(this.largeImageMode && this.hasScrollTab)) {
         return false;
       }
 
@@ -21,7 +21,7 @@ export default createComponent({
   ],
   props: {
     skuRow: Object,
-    largePicturePreview: {
+    largeImageMode: {
       type: Boolean,
       default: false,
     },
@@ -40,7 +40,7 @@ export default createComponent({
   },
   computed: {
     scrollStyle() {
-      if (!(this.largePicturePreview && this.hasScrollTab)) {
+      if (!(this.largeImageMode && this.hasScrollTab)) {
         return false;
       }
       this.tranX = this.present * 20;
@@ -60,7 +60,7 @@ export default createComponent({
     },
   },
   render() {
-    const { skuRow, largePicturePreview, hasScrollTab } = this;
+    const { skuRow, largeImageMode, hasScrollTab } = this;
     const multipleNode = skuRow.is_multiple && (
       <span class={bem('title-multiple')}>（{t('multiple')}）</span>
     );
@@ -86,15 +86,13 @@ export default createComponent({
       </div>
     );
     return (
-      <div
-        class={[bem(), BORDER_BOTTOM, largePicturePreview && bem('picture')]}
-      >
+      <div class={[bem(), BORDER_BOTTOM, largeImageMode && bem('picture')]}>
         <div class={bem('title')}>
           {skuRow.k}
           {multipleNode}
         </div>
-        {largePicturePreview ? SkuContent : this.slots()}
-        {largePicturePreview && hasScrollTab && SkuScroll}
+        {largeImageMode ? SkuContent : this.slots()}
+        {largeImageMode && hasScrollTab && SkuScroll}
       </div>
     );
   },

src/sku/components/SkuRowItem.js

@@ -10,7 +10,7 @@ export default createComponent({
     skuKeyStr: String,
     skuEventBus: Object,
     selectedSku: Object,
-    largePicturePreview: Boolean,
+    largeImageMode: Boolean,
     skuList: {
       type: Array,
       default: () => [],
@@ -20,7 +20,7 @@ export default createComponent({
   computed: {
     imgUrl() {
       const url = this.skuValue.imgUrl || this.skuValue.img_url;
-      return this.largePicturePreview
+      return this.largeImageMode
         ? url ||
             'https://img.yzcdn.cn/upload_files/2020/06/24/FmKWDg0bN9rMcTp9ne8MXiQWGtLn.png'
         : url;
@@ -52,7 +52,7 @@ export default createComponent({
     genImage(classPrefix) {
       const { imgUrl } = this;
       if (imgUrl) {
-        if (this.largePicturePreview && this.lazyLoad) {
+        if (this.largeImageMode && this.lazyLoad) {
           return (
             <img class={`${classPrefix}-img`} src={imgUrl} vLazy={imgUrl} />
           );
@@ -65,7 +65,7 @@ export default createComponent({
 
   render() {
     const choosed = this.skuValue.id === this.selectedSku[this.skuKeyStr];
-    const classPrefix = this.largePicturePreview
+    const classPrefix = this.largeImageMode
       ? 'van-sku-row__picture-item'
       : 'van-sku-row__item';
 
@@ -78,7 +78,7 @@ export default createComponent({
         ]}
         onClick={this.onSelect}
       >
-        {this.largePicturePreview && (
+        {this.largeImageMode && (
           <img
             class={`${classPrefix}-img-icon`}
             src="https://img.yzcdn.cn/upload_files/2020/06/18/Fn6Qf0fGRFyuD8xh0Gi1w2ng59G1.png"
@@ -87,9 +87,7 @@ export default createComponent({
         )}
         {this.genImage(classPrefix)}
         <div class={`${classPrefix}-name`}>
-          <span
-            class={this.largePicturePreview ? 'van-multi-ellipsis--l2' : ''}
-          >
+          <span class={this.largeImageMode ? 'van-multi-ellipsis--l2' : ''}>
             {this.skuValue.name}
           </span>
         </div>