[improvement] Notify: jsx (#2557)

packages/notify/Notify.js

@@ -0,0 +1,43 @@
+import { use } from '../utils';
+import PopupMixin from '../mixins/popup';
+import { RED, WHITE } from '../utils/color';
+
+const [sfc, bem] = use('notify');
+
+export default sfc({
+  mixins: [PopupMixin],
+
+  props: {
+    message: [String, Number],
+    color: {
+      type: String,
+      value: WHITE
+    },
+    background: {
+      type: String,
+      value: RED
+    },
+    duration: {
+      type: Number,
+      value: 3000
+    },
+    lockScroll: {
+      type: Boolean,
+      default: false
+    }
+  },
+
+  render(h) {
+    const style = {
+      color: this.color,
+      background: this.background
+    };
+    return (
+      <transition name="van-slide-down">
+        <div v-show={this.value} class={bem()} style={style}>
+          {this.message}
+        </div>
+      </transition>
+    );
+  }
+});

packages/notify/Notify.vue

@@ -1,51 +0,0 @@
-<template>
-  <transition name="van-slide-down">
-    <div
-      v-show="value"
-      v-text="message"
-      :class="b()"
-      :style="style"
-    />
-  </transition>
-</template>
-
-<script>
-import Popup from '../mixins/popup';
-import create from '../utils/create';
-import { RED, WHITE } from '../utils/color';
-
-export default create({
-  name: 'notify',
-
-  mixins: [Popup],
-
-  props: {
-    message: [String, Number],
-    color: {
-      type: String,
-      value: WHITE
-    },
-    background: {
-      type: String,
-      value: RED
-    },
-    duration: {
-      type: Number,
-      value: 3000
-    },
-    lockScroll: {
-      type: Boolean,
-      default: false
-    }
-  },
-
-  computed: {
-    style() {
-      return {
-        color: this.color,
-        background: this.background
-      };
-    }
-  }
-});
-</script>