make Message and Notice support render

src/components/base/notification/index.js

@@ -5,7 +5,6 @@ Notification.newInstance = properties => {
     const _props = properties || {};
 
     const Instance = new Vue({
-        data: _props,
         render (h) {
             return h(Notification, {
                 props: _props

src/components/base/notification/notice.vue

@@ -2,7 +2,12 @@
     <transition :name="transitionName" @enter="handleEnter" @leave="handleLeave">
         <div :class="classes" :style="styles">
             <template v-if="type === 'notice'">
-                <div :class="[baseClass + '-content']" ref="content" v-html="content"></div>
+                <div :class="contentClasses" ref="content" v-html="content"></div>
+                <div :class="contentWithIcon" ref="content">
+                    <render-cell
+                        :render="renderFunc"
+                    ></render-cell>
+                </div>
                 <a :class="[baseClass + '-close']" @click="close" v-if="closable">
                     <i class="ivu-icon ivu-icon-ios-close-empty"></i>
                 </a>
@@ -10,6 +15,11 @@
             <template v-if="type === 'message'">
                 <div :class="[baseClass + '-content']" ref="content">
                     <div :class="[baseClass + '-content-text']" v-html="content"></div>
+                    <div :class="[baseClass + '-content-text']">
+                        <render-cell
+                            :render="renderFunc"
+                        ></render-cell>
+                    </div>
                     <a :class="[baseClass + '-close']" @click="close" v-if="closable">
                         <i class="ivu-icon ivu-icon-ios-close-empty"></i>
                     </a>
@@ -19,7 +29,11 @@
     </transition>
 </template>
 <script>
+    import RenderCell from '../render';
     export default {
+        components: {
+            RenderCell
+        },
         props: {
             prefixCls: {
                 type: String,
@@ -36,6 +50,10 @@
                 type: String,
                 default: ''
             },
+            withIcon: Boolean,
+            render: {
+                type: Function
+            },
             styles: {
                 type: Object,
                 default: function() {
@@ -71,6 +89,9 @@
             baseClass () {
                 return `${this.prefixCls}-notice`;
             },
+            renderFunc () {
+                return this.render || function () {};
+            },
             classes () {
                 return [
                     this.baseClass,
@@ -82,7 +103,22 @@
                 ];
             },
             contentClasses () {
-                return `${this.baseClass}-content`;
+                return [
+                    `${this.baseClass}-content`,
+                    this.render !== undefined ? `${this.baseClass}-content-with-render` : ''
+                ];
+            },
+            contentWithIcon () {
+                return [
+                    this.withIcon ? `${this.prefixCls}-content-with-icon` : '',
+                    this.render && !this.title && this.withIcon ? `${this.prefixCls}-content-with-render-notitle` : ''
+                ];
+            },
+            messageClasses () {
+                return [
+                    `${this.baseClass}-content`,
+                    this.render !== undefined ? `${this.baseClass}-content-with-render` : ''
+                ];
             }
         },
         methods: {
@@ -124,7 +160,8 @@
 
             // check if with desc in Notice component
             if (this.prefixCls === 'ivu-notice') {
-                this.withDesc = this.$refs.content.querySelectorAll(`.${this.prefixCls}-desc`)[0].innerHTML !== '';
+                let desc = this.$refs.content.querySelectorAll(`.${this.prefixCls}-desc`)[0];
+                this.withDesc = this.render ? true : (desc ? desc.innerHTML !== '' : false);
             }
         },
         beforeDestroy () {

src/components/base/notification/notification.vue

@@ -8,6 +8,8 @@
             :type="notice.type"
             :content="notice.content"
             :duration="notice.duration"
+            :render="notice.render"
+            :withIcon="notice.withIcon"
             :closable="notice.closable"
             :name="notice.name"
             :transition-name="notice.transitionName"