ソースを参照

组件 icon (#1975)

* feat: 处理组件tsc问题

* feat: popup icons-vue

* feat: 删除注释

* feat: 删除多余注释

* feat: popup icons-vue

* feat: popup taro demo修改icon

* feat: popup md 修改

* feat: navbar icon替换

* feat: progress icon替换

* feat: navbar 修改titicon参数名

* feat: navbar md titicon

* fix: navbar icon
ailululu 3 年 前
コミット
89072769ef

+ 1 - 3
src/packages/__VUE/comment/index.taro.vue

@@ -19,9 +19,7 @@
     <comment-images :images="images" :videos="videos" :type="imagesRows" @clickImages="clickImages"></comment-images>
 
     <view class="nut-comment__follow" v-if="follow && follow.days > 0" @click="handleClick">
-      <view class="nut-comment__follow-title"
-        >购买{{ follow.days }}天后追评</view
-      >
+      <view class="nut-comment__follow-title">购买{{ follow.days }}天后追评</view>
       <view class="nut-comment__follow-com">{{ follow.content }}</view>
       <view class="nut-comment__follow-img" v-if="follow.images && follow.images.length > 0"
         >{{ follow.images.length }} 张追评图片 <Right width="12px"></Right

+ 2 - 1
src/packages/__VUE/imagepreview/index.taro.vue

@@ -22,7 +22,8 @@
 
     <view class="nut-image-preview-index" v-if="showIndex"> {{ active + 1 }} / {{ images.length }} </view>
     <view class="nut-image-preview-close-icon" @click="onClose" :style="styles" v-if="closeable"
-      ><CircleClose color="#ffffff"></CircleClose></view>
+      ><CircleClose color="#ffffff"></CircleClose
+    ></view>
   </nut-popup>
 </template>
 <script lang="ts">

+ 0 - 3
src/packages/__VUE/navbar/doc.en-US.md

@@ -155,9 +155,6 @@ export default {
         <nut-tab-pane title="Title3"> </nut-tab-pane>
       </nut-tabs>
     </template>
-    <template #icons>
-        <nut-icon class="icon" name="share"></nut-icon>
-      </template>
 
     <template #right>
       <HorizontalN class="right" width="16px"></HorizontalN>

+ 18 - 10
src/packages/__VUE/navbar/doc.taro.md

@@ -27,7 +27,7 @@ app.use(TabPane);
       <div>返回</div>
     </template>
     <template #right>
-      <nut-icon class="right" name="share-n"></nut-icon>
+      <ShareN width="16px"></ShareN>
     </template>
   </nut-navbar>
 
@@ -46,18 +46,23 @@ app.use(TabPane);
     @on-click-icon="icon"
     @on-click-right="rightClick"
     title="购物车"
-    titleIcon="cart2"
+    :titleIcon="true"
     desc="编辑"
   >
+    <template #titleIcon>
+      <Cart2 width="16px"></Cart2>
+    </template>
     <template #right>
-      <nut-icon class="right" name="more-x"></nut-icon>
+      <MoreX class="right" width="16px"></MoreX>
     </template>
   </nut-navbar>
 </template>
 
 <script lang="ts">
   import { ref } from 'vue';
+  import { ShareN, Cart2, MoreX } from '@nutui/icons-vue';
   export default {
+  components: { ShareN, Cart2, MoreX },
   setup() {
     const methods = {
       back() {
@@ -100,14 +105,16 @@ app.use(TabPane);
     </template>
 
     <template #right>
-      <nut-icon class="right" name="more-x"></nut-icon>
+      <MoreX class="right" width="16px"></MoreX>
     </template>
   </nut-navbar>
 </template>
 
 <script lang="ts">
 import { ref } from 'vue';
+import { MoreX } from '@nutui/icons-vue';
 export default {
+  components: { MoreX },
   setup() {
     const tab1value = ref(0);
     const methods = {
@@ -148,19 +155,18 @@ export default {
         <nut-tab-pane title="标题3"> </nut-tab-pane>
       </nut-tabs>
     </template>
-    <template #icons>
-      <nut-icon class="icon" name="share"></nut-icon>
-    </template>
 
     <template #right>
-      <nut-icon class="right" name="horizontal-n"></nut-icon>
+      <HorizontalN class="right" width="16px"></HorizontalN>
     </template>
   </nut-navbar>
 </template>
 
 <script lang="ts">
   import { ref } from 'vue';
+  import { HorizontalN } from '@nutui/icons-vue';
   export default {
+    components: { HorizontalN },
     setup() {
     const tab2value = ref(0);
     const methods = {
@@ -190,7 +196,7 @@ export default {
 | left-text       | 左侧文案                                                 | String  | -       |
 | desc            | 右侧描述                                                 | String  | -       |
 | left-show       | 是否展示左侧箭头                                          | Boolean | false   |
-| title-icon        | 标题中插入icon                                           | String  | -       |
+| title-icon        | 标题中是否展示icon                                        | Boolean  | false      |
 | border          | 是否显示下边框                                            | Boolean  | false  |
 | fixed           | 是否固定到顶部                                            | Boolean  | false    |
 | placeholder     | 固定在顶部时,是否在标签位置生成一个等高的占位元素              | Boolean  | false   |
@@ -212,6 +218,8 @@ export default {
 | left | 自定义左侧内容 |  |
 | right | 自定义右侧内容 |  |
 | content |  自定义导航栏中间内容 |  |
+| leftShow  | 左侧箭头自定义图标 |
+| titleIcon  | 标题中自定义图标 |
 
 ## 主题定制
 
@@ -232,4 +240,4 @@ export default {
 | --nut-navbar-title-font-weight| _0_ | -  |
 | --nut-navbar-title-font-color| _var(--nut-navbar-color)_ | -  |
 | --nut-navbar-title-width| _100px_ | -  |
-| --nut-navbar-title-icon-margin| _0 0 0 13px_ | -  |
+| --nut-navbar-title-icon-margin| _0 0 0 13px_ | -  |

+ 0 - 3
src/sites/mobile-taro/vue/src/nav/pages/navbar/index.vue

@@ -61,9 +61,6 @@
           <nut-tab-pane title="推荐"> </nut-tab-pane>
         </nut-tabs>
       </template>
-      <template #icons>
-        <nut-icon class="icon" name="share"></nut-icon>
-      </template>
 
       <template #right>
         <HorizontalN class="right" width="16px"></HorizontalN>