[improvement] directive naming-style in jsx (#2677)

packages/actionsheet/index.js

@@ -88,7 +88,7 @@ export default sfc({
 
     return (
       <transition name="van-slide-up">
-        <div v-show={this.value} class={bem({ withtitle: title })}>
+        <div vShow={this.value} class={bem({ withtitle: title })}>
           {title ? Header() : this.actions.map(Option)}
           {Footer}
         </div>

packages/address-edit/index.js

@@ -224,7 +224,7 @@ export default sfc({
     return (
       <div class={bem()}>
         <Field
-          v-model={data.name}
+          vModel={data.name}
           clearable
           label={t('name')}
           placeholder={t('namePlaceholder')}
@@ -232,7 +232,7 @@ export default sfc({
           onFocus={onFocus('name')}
         />
         <Field
-          v-model={data.tel}
+          vModel={data.tel}
           clearable
           type="tel"
           label={t('tel')}
@@ -241,7 +241,7 @@ export default sfc({
           onFocus={onFocus('tel')}
         />
         <Field
-          v-show={this.showArea}
+          vShow={this.showArea}
           readonly
           label={t('area')}
           placeholder={t('areaPlaceholder')}
@@ -251,7 +251,7 @@ export default sfc({
           }}
         />
         <Detail
-          v-show={this.showDetail}
+          vShow={this.showDetail}
           focused={this.detailFocused}
           value={data.addressDetail}
           error={errorInfo.addressDetail}
@@ -269,8 +269,8 @@ export default sfc({
         />
         {this.showPostal && (
           <Field
-            v-show={!hideBottomFields}
+            vShow={!hideBottomFields}
-            v-model={data.postalCode}
+            vModel={data.postalCode}
             type="tel"
             maxlength="6"
             label={t('postal')}
@@ -282,15 +282,15 @@ export default sfc({
         {this.$slots.default}
         {this.showSetDefault && (
           <SwitchCell
-            v-model={data.isDefault}
+            vModel={data.isDefault}
-            v-show={!hideBottomFields}
+            vShow={!hideBottomFields}
             title={t('defaultAddress')}
             onChange={event => {
               this.$emit('change-default', event);
             }}
           />
         )}
-        <div v-show={!hideBottomFields} class={bem('buttons')}>
+        <div vShow={!hideBottomFields} class={bem('buttons')}>
           <Button
             block
             loading={this.isSaving}
@@ -308,7 +308,7 @@ export default sfc({
           )}
         </div>
         <Popup
-          v-model={this.showAreaPopup}
+          vModel={this.showAreaPopup}
           position="bottom"
           lazyRender={false}
           getContainer="body"

packages/address-list/Item.js

@@ -25,7 +25,7 @@ export default sfc({
     return (
       <Cell
         class={bem({ disabled, unswitchable: !switchable })}
-        is-link={!disabled && switchable}
+        isLink={!disabled && switchable}
         onClick={this.onSelect}
       >
         <Radio name={data.id}>

packages/card/index.js

@@ -34,7 +34,7 @@ export default sfc({
       <a href={this.thumbLink} class={bem('thumb')}>
         {slots.thumb ||
           (this.lazyLoad ? (
-            <img class={bem('img')} v-lazy={thumb} />
+            <img class={bem('img')} vLazy={thumb} />
           ) : (
             <img class={bem('img')} src={thumb} />
           ))}

packages/collapse-item/index.js

@@ -123,7 +123,7 @@ export default sfc({
 
     const Content = this.inited && (
       <div
-        v-show={this.show}
+        vShow={this.show}
         ref="wrapper"
         class={bem('wrapper')}
         onTransitionend={this.onTransitionEnd}

packages/contact-edit/index.js

@@ -95,7 +95,7 @@ export default sfc({
     return (
       <div class={bem()}>
         <Field
-          v-model={data.name}
+          vModel={data.name}
           clearable
           maxlength="30"
           label={t('name')}
@@ -104,7 +104,7 @@ export default sfc({
           onFocus={onFocus('name')}
         />
         <Field
-          v-model={data.tel}
+          vModel={data.tel}
           clearable
           type="tel"
           label={t('tel')}

packages/coupon-cell/index.js

@@ -52,8 +52,8 @@ export default sfc({
         title={this.title || t('title')}
         value={this.value}
         border={this.border}
-        is-link={this.editable}
+        isLink={this.editable}
-        value-class={this.valueClass}
+        valueClass={this.valueClass}
         onClick={() => {
           this.$emit('click');
         }}

packages/coupon-list/index.js

@@ -103,7 +103,7 @@ export default sfc({
     onClickExchangeButton() {
       this.$emit('exchange', this.currentCode);
 
-      // auto clear currentCode when not use v-model
+      // auto clear currentCode when not use vModel
       if (!this.code) {
         this.currentCode = '';
       }
@@ -129,7 +129,7 @@ export default sfc({
   render(h) {
     const ExchangeBar = this.showExchangeBar && (
       <Field
-        v-model={this.currentCode}
+        vModel={this.currentCode}
         clearable
         border={false}
         class={bem('field')}
@@ -190,12 +190,12 @@ export default sfc({
     return (
       <div class={bem()}>
         {ExchangeBar}
-        <Tabs v-model={this.tab} class={bem('tab')} line-width={120}>
+        <Tabs vModel={this.tab} class={bem('tab')} line-width={120}>
           {CouponTab}
           {DisabledCouponTab}
         </Tabs>
         <Button
-          v-show={this.showCloseButton}
+          vShow={this.showCloseButton}
           size="large"
           class={bem('close')}
           text={this.closeButtonText || t('close')}

packages/dialog/Dialog.js

@@ -89,7 +89,7 @@ export default sfc({
     const ButtonGroup = (
       <div class={['van-hairline--top', bem('footer', { buttons: hasButtons })]}>
         <Button
-          v-show={this.showCancelButton}
+          vShow={this.showCancelButton}
           size="large"
           class={bem('cancel')}
           loading={this.loading.cancel}
@@ -99,7 +99,7 @@ export default sfc({
           }}
         />
         <Button
-          v-show={this.showConfirmButton}
+          vShow={this.showConfirmButton}
           size="large"
           class={[bem('confirm'), { 'van-hairline--left': hasButtons }]}
           loading={this.loading.confirm}
@@ -113,7 +113,7 @@ export default sfc({
 
     return (
       <transition name="van-dialog-bounce">
-        <div v-show={this.value} class={[bem(), this.className]}>
+        <div vShow={this.value} class={[bem(), this.className]}>
           {Title}
           {Content}
           {ButtonGroup}

packages/image-preview/ImagePreview.js

@@ -219,9 +219,9 @@ export default sfc({
       <Swipe
         ref="swipe"
         loop={this.loop}
-        indicator-color="white"
+        indicatorColor="white"
-        initial-swipe={this.startPosition}
+        initialSwipe={this.startPosition}
-        show-indicators={this.showIndicators}
+        showIndicators={this.showIndicators}
         onChange={this.onChange}
       >
         {images.map((image, index) => {
@@ -237,7 +237,7 @@ export default sfc({
           };
           return (
             <SwipeItem>
-              {this.lazyLoad ? <img v-lazy={image} {...props} /> : <img src={image} {...props} />}
+              {this.lazyLoad ? <img vLazy={image} {...props} /> : <img src={image} {...props} />}
             </SwipeItem>
           );
         })}

packages/notice-bar/index.js

@@ -90,7 +90,7 @@ export default sfc({
 
     return (
       <div
-        v-show={this.showNoticeBar}
+        vShow={this.showNoticeBar}
         class={bem({ withicon: mode })}
         style={barStyle}
         onClick={() => {

packages/notify/Notify.js

@@ -34,7 +34,7 @@ export default sfc({
     };
     return (
       <transition name="van-slide-down">
-        <div v-show={this.value} class={bem()} style={style}>
+        <div vShow={this.value} class={bem()} style={style}>
           {this.message}
         </div>
       </transition>

packages/number-keyboard/index.js

@@ -138,7 +138,7 @@ export default sfc({
     return (
       <transition name={this.transition ? 'van-slide-up' : ''}>
         <div
-          v-show={this.show}
+          vShow={this.show}
           style={{ zIndex: this.zIndex }}
           class={bem([theme])}
           onTouchstart={stop}

packages/overlay/index.js

@@ -19,7 +19,7 @@ export default sfc({
     return (
       <transition name="van-fade">
         <div
-          v-show={this.visible}
+          vShow={this.visible}
           style={style}
           class={[bem(), this.className]}
           onTouchmove={event => {

packages/tab/index.js

@@ -59,7 +59,7 @@ export default sfc({
   render(h) {
     const slots = this.$slots;
     return (
-      <div v-show={this.selected || this.parent.animated} class={bem('pane')}>
+      <div vShow={this.selected || this.parent.animated} class={bem('pane')}>
         {this.inited ? slots.default : h()}
         {slots.title && <div ref="title">{slots.title}</div>}
       </div>

packages/toast/Toast.js

@@ -89,7 +89,7 @@ export default sfc({
 
     return (
       <transition name="van-fade">
-        <div v-show={this.value} class={bem([style, this.position])}>
+        <div vShow={this.value} class={bem([style, this.position])}>
           {Content()}
         </div>
       </transition>