[improvement] update basic icons (#2159)

packages/cell/index.less

@@ -43,31 +43,21 @@
     }
   }
 
-  &__left-icon {
+  &__left-icon,
+  &__right-icon {
     height: 24px;
     min-width: 1em;
     font-size: 16px;
     line-height: 24px;
+  }
+
+  &__left-icon {
     margin-right: 5px;
   }
 
   &__right-icon {
     color: @gray-dark;
-    font-size: 12px;
-    line-height: 24px;
     margin-left: 5px;
-
-    &--left::before {
-      transform: rotate(180deg);
-    }
-
-    &--up::before {
-      transform: rotate(-90deg);
-    }
-
-    &--down::before {
-      transform: rotate(90deg);
-    }
   }
 
   &--clickable {

packages/cell/index.vue

@@ -42,8 +42,8 @@
     <slot name="right-icon">
       <icon
         v-if="isLink"
-        :class="b('right-icon', arrowDirection)"
-        name="arrow"
+        :class="b('right-icon')"
+        :name="arrowIcon"
       />
     </slot>
     <slot name="extra" />
@@ -84,6 +84,12 @@ export default create({
     }
   },
 
+  computed: {
+    arrowIcon() {
+      return this.arrowDirection ? `arrow-${this.arrowDirection}` : 'arrow';
+    }
+  },
+
   methods: {
     onClick() {
       this.$emit('click');

packages/cell/test/__snapshots__/demo.spec.js.snap

@@ -90,7 +90,7 @@ exports[`renders demo correctly 1`] = `
         <!---->
       </div>
       <div class="van-cell__value"><span>内容</span></div>
-      <i class="van-icon van-icon-arrow van-cell__right-icon van-cell__right-icon--down" style="color:undefined;font-size:undefined;">
+      <i class="van-icon van-icon-arrow-down van-cell__right-icon" style="color:undefined;font-size:undefined;">
         <!---->
         <!---->
       </i>