Merge pull request #320 from ant-mini-program/fix/native-renderer

fix: 适配 native 渲染模式

Author: Phieo

components/input-item/index.axml

@@ -24,7 +24,7 @@
       onFocus="onFocus"
       onBlur="onBlur"
     />
-    <view class="am-input-clear {{clear && value.length > 0 && !disabled && _focus ? 'show' : 'hidden'}}" onTap="onClear">
+    <view class="am-input-clear {{clear && value.length > 0 && !disabled && (_focus || _native) ? 'show' : 'hidden'}}" onTap="onClear">
       <icon size="18" type="clear" />
     </view>
     <slot name="extra" />

components/input-item/index.ts

@@ -27,9 +27,11 @@ Component({
   },
   data: {
     _focus: false,
+    _native: false,
   },
   didMount() {
     this.setData({
+      _native: this.renderer === 'native',
       _focus: this.props.focus,
     });
   },

components/search-bar/index.axml

@@ -19,7 +19,7 @@
       onConfirm="handleConfirm"
       sync-input="{{true}}"
       onBlur="handleBlur" />
-    <view class="am-search-clear {{ _value.length > 0 && focus ? 'am-search-clear-show' : '' }}" onTap="handleClear">
+    <view class="am-search-clear {{ _value.length > 0 && (focus || _native) ? 'am-search-clear-show' : '' }}" onTap="handleClear">
       <icon type="clear" size="14" />
     </view>
   </view>

components/search-bar/index.less

@@ -35,7 +35,7 @@
     height: 14px;
     width: 14px;
     display: inline-block;
-    background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4KPHN2ZyB3aWR0aD0iMjhweCIgaGVpZ2h0PSIyOHB4IiB2aWV3Qm94PSIwIDAgMjggMjgiIHZlcnNpb249IjEuMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayI+CiAgICA8IS0tIEdlbmVyYXRvcjogU2tldGNoIDQ5LjMgKDUxMTY3KSAtIGh0dHA6Ly93d3cuYm9oZW1pYW5jb2RpbmcuY29tL3NrZXRjaCAtLT4KICAgIDx0aXRsZT5TaGFwZTwvdGl0bGU+CiAgICA8ZGVzYz5DcmVhdGVkIHdpdGggU2tldGNoLjwvZGVzYz4KICAgIDxkZWZzPjwvZGVmcz4KICAgIDxnIGlkPSLnu4Tku7blupPlj4rmoIfms6giIHN0cm9rZT0ibm9uZSIgc3Ryb2tlLXdpZHRoPSIxIiBmaWxsPSJub25lIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiPgogICAgICAgIDxnIGlkPSLlhbbku5YiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC0zMDUzLjAwMDAwMCwgLTgwMi4wMDAwMDApIiBmaWxsPSIjQjJCMkIyIj4KICAgICAgICAgICAgPGcgaWQ9IuaQnOe0ouWFpeWPoyIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMjk5My4wMDAwMDAsIDczMi4wMDAwMDApIj4KICAgICAgICAgICAgICAgIDxnIGlkPSJpb3M25bqU55So5Lit5b+D5a+86IiqIj4KICAgICAgICAgICAgICAgICAgICA8cGF0aCBkPSJNODYuMDc4NDMwOCw5OCBMNzkuNDkwMTk1Niw5MC45MjE0MzUyIEM3Ny41MTU1MTcyLDkyLjQ2MTY5OTYgNzQuNDEyMzk5OCw5My45NzQ0NzcxIDcxLjczNzAyMTQsOTMuOTc0NDc3MSBDNjUuMjU0ODk0LDkzLjk3NDQ3NzEgNjAsODguNjA3NTY1OCA2MCw4MS45ODczNTg2IEM2MCw3NS4zNjcxNTE0IDY1LjI1NDg5NCw3MCA3MS43MzcwMjE0LDcwIEM3OC4yMTg2NzQzLDcwIDgzLjQ3MzU2ODIsNzUuMzY2NjcxMiA4My40NzM1NjgyLDgxLjk4NzExODUgQzgzLjQ3MzU2ODIsODQuNTk3NjkxMyA4Mi42NDc1ODIyLDg3LjAwNjU0NTcgODEuMjU5OTQ0Nyw4OC45NzQ1MDEzIEw4OCw5NS44MzcwMTA3IEw4Ni4wNzg0MzA4LDk4IFogTTcxLjczNzA1MjgsNzIuNTA2MTAzNyBDNjYuNjA5NDg0NCw3Mi41MDYxMDM3IDYyLjQ1MjgyNjgsNzYuNzUwNjY3MSA2Mi40NTI4MjY4LDgxLjk4NzEwNzkgQzYyLjQ1MjgyNjgsODcuMjIzNTQ4NyA2Ni42MDkyMzY3LDkxLjQ2ODYxMzYgNzEuNzM3MDUyOCw5MS40Njg2MTM2IEM3Ni44NjMzODI0LDkxLjQ2ODYxMzYgODEuMDE5NzkyMyw4Ny4yMjM1NDg3IDgxLjAxOTc5MjMsODEuOTg3MTA3OSBDODEuMDE5NzkyMyw3Ni43NTA2NjcxIDc2Ljg2MzM4MjQsNzIuNTA2MTAzNyA3MS43MzcwNTI4LDcyLjUwNjEwMzcgTDcxLjczNzA1MjgsNzIuNTA2MTAzNyBaIiBpZD0iU2hhcGUiPjwvcGF0aD4KICAgICAgICAgICAgICAgIDwvZz4KICAgICAgICAgICAgPC9nPgogICAgICAgIDwvZz4KICAgIDwvZz4KPC9zdmc+');
+    background-image: url(https://mdn.alipayobjects.com/huamei_eyzuti/afts/img/A*tLN6QrLj5zwAAAAAAAAAAAAADlPaAQ/original);
     background-size: contain;
     margin-right: 6px;
     vertical-align: -2px;

components/search-bar/index.ts

@@ -7,9 +7,11 @@ Component({
   data: {
     _value: '',
     focus: false,
+    _native: false,
   },
   didMount() {
     this.setData({
+      _native: this.renderer === 'native',
       _value: ('value' in this.props) ? this.props.value : '',
       focus: this.props.focus,
     });

components/tabs/index.axml

@@ -2,7 +2,7 @@
 <view class="am-tabs {{className}}">
   <view class="am-tabs-tab-bar-wrap">
     <view class="am-tabs-bar">
-      <view class="am-tabs-bar-content-wrap">
+      <view class="am-tabs-bar-content-wrap" style="{{_native ? 'overflow:hidden;': ''}}">
         <view class="am-tabs-scroll-left"></view>
         <view class="am-tabs-scroll-right"></view>
         <scroll-view

components/tabs/index.ts

@@ -21,10 +21,12 @@ Component({
     autoplay: false,
     animation: false,
     version: my.SDKVersion,
+    _native: false,
   },
   didMount() {
     const { tabs, animation } = this.props;
     this.setData({
+      _native: this.renderer === 'native',
       tabWidth: tabs.length > 3 ? 0.25 : 1 / tabs.length,
       animation,
       autoplay: true,