diff --git a/docs/renderers/Carousel.md b/docs/renderers/Carousel.md
index 508925a6..9dc709e4 100644
--- a/docs/renderers/Carousel.md
+++ b/docs/renderers/Carousel.md
@@ -12,7 +12,7 @@
         -  `titleClassName` 图片标题类名
         -  `description` 图片描述
         -  `descriptionClassName` 图片描述类名
-    -   `item` HTML 自定义，同[Tpl](./Tpl.md)一致
+    -   `html` HTML 自定义，同[Tpl](./Tpl.md)一致
 -   `itemSchema` 自定义`schema`来展示数据
 -   `auto` 是否自动轮播，默认`true`
 -   `interval` 切换动画间隔，默认`5s`
diff --git a/examples/components/Carousel.jsx b/examples/components/Carousel.jsx
index 741b8ab9..53e4c771 100644
--- a/examples/components/Carousel.jsx
+++ b/examples/components/Carousel.jsx
@@ -2,9 +2,14 @@ export default {
     type: 'page',
     title: '轮播图',
     data: {
-        carousel: [
+        carousel0: [
+            'https://www.baidu.com/img/bd_logo1.png',
+            'https://video-react.js.org/assets/poster.png',
+            'https://ss0.bdstatic.com/70cFvHSh_Q1YnxGkpoWK1HF6hhy/it/u=3893101144,2877209892&fm=23&gp=0.jpg'
+        ],
+        carousel1: [
             {
-                item: '<div style="width: 100%; height: 300px; background: #e3e3e3; text-align: center; line-height: 300px;">carousel data in form</div>'
+                html: '<div style="width: 100%; height: 300px; background: #e3e3e3; text-align: center; line-height: 300px;">carousel data in form</div>'
             },
             {
                 image: 'https://www.baidu.com/img/bd_logo1.png'
@@ -19,31 +24,53 @@ export default {
             type: 'grid',
             columns: [
                 {
-                    type: 'carousel',
-                    controlsTheme: 'light',
-                    height: '300',
-                    className: 'm-t-xxl',
-                    options: [
-                        {
-                            image: 'https://video-react.js.org/assets/poster.png'
-                        },
-                        {
-                            item: '<div style="width: 100%; height: 300px; background: #e3e3e3; text-align: center; line-height: 300px;">carousel data</div>'
-                        },
-                        {
-                            image: 'https://ss0.bdstatic.com/70cFvHSh_Q1YnxGkpoWK1HF6hhy/it/u=3893101144,2877209892&fm=23&gp=0.jpg'
-                        }
-                    ]
+                    type: 'panel',
+                    title: '直接页面配置',
+                    body: {
+                        type: 'carousel',
+                        controlsTheme: 'light',
+                        height: '300',
+                        options: [
+                            {
+                                image: 'https://video-react.js.org/assets/poster.png'
+                            },
+                            {
+                                html: '<div style="width: 100%; height: 300px; background: #e3e3e3; text-align: center; line-height: 300px;">carousel data</div>'
+                            },
+                            {
+                                image: 'https://ss0.bdstatic.com/70cFvHSh_Q1YnxGkpoWK1HF6hhy/it/u=3893101144,2877209892&fm=23&gp=0.jpg'
+                            }
+                        ]
+                    }
                 },
+                {
+                    type: 'panel',
+                    title: '使用itemSchema配置',
+                    body: {
+                        type: 'carousel',
+                        name: 'carousel0',
+                        controlsTheme: 'dark',
+                        height: '300',
+                        itemSchema: {
+                            type: 'tpl',
+                            tpl: '<img src=\"<%=data.item%>\" />'
+                        }
+                    }
+                }
+            ]
+        },
+        {
+            type: 'grid',
+            columns: [
                 {
                     type: 'form',
-                    title: '表单',
-                    className: 'm-b-xxl',
+                    title: '表单内展示',
+                    sm: 6,
                     controls: [
                         {
                             type: 'carousel',
                             controlsTheme: 'dark',
-                            name: 'carousel',
+                            name: 'carousel1',
                             label: 'carousel',
                             animation: 'slide',
                             height: '300'
diff --git a/mock/crud/list.js b/mock/crud/list.js
index f2bcc656..d6551266 100644
--- a/mock/crud/list.js
+++ b/mock/crud/list.js
@@ -30,7 +30,7 @@ module.exports = function(req, res) {
                         image: 'https://ss0.bdstatic.com/70cFvHSh_Q1YnxGkpoWK1HF6hhy/it/u=3893101144,2877209892&fm=23&gp=0.jpg'
                     },
                     {
-                        item: '<div style="width: 100%; height: 200px; background: #e3e3e3; text-align: center; line-height: 200px;">carousel data in crud</div>'
+                        html: '<div style="width: 100%; height: 200px; background: #e3e3e3; text-align: center; line-height: 200px;">carousel data in crud</div>'
                     },
                     {
                         image: 'https://video-react.js.org/assets/poster.png'
diff --git a/src/renderers/Carousel.tsx b/src/renderers/Carousel.tsx
index 0b5815a1..a9df8cc3 100644
--- a/src/renderers/Carousel.tsx
+++ b/src/renderers/Carousel.tsx
@@ -213,7 +213,8 @@ export class Carousel extends React.Component<CarouselProps, CarouselState> {
             height,
             controls,
             controlsTheme,
-            placeholder
+            placeholder,
+            data
         } = this.props;
         const {
             options,
@@ -223,17 +224,31 @@ export class Carousel extends React.Component<CarouselProps, CarouselState> {
         } = this.state;
         const defaultSchema = {
             type: 'tpl',
-            tpl:
-            "<% if (data.image) { %> " +
-                "<div style=\"background-image: url(<%= data.image %>)\" class=\"image <%= data.imageClassName %>\"></div>" +
-                "<% if (data.title) { %> " +
-                    "<div class=\"title <%= data.titleClassName %>\"><%= data.title %></div>" +
-                "<% } if (data.description) { %> " +
-                    "<div class=\"description <%= data.descriptionClassName %>\"><%= data.description %></div>" +
-                "<% } %>" +
-            "<% } else if (data.item) { %>" +
-                "<%= data.item %>" +
-            "<% } %>"
+            tpl: `
+            <% if (data.hasOwnProperty('image')) { %>
+                <div style="background-image: url(<%= data.image %>)" class="image <%= data.imageClassName %>"></div>
+                <% if (data.title) { %>
+                    <div class="title <%= data.titleClassName %>"><%= data.title %></div>
+                <% } if (data.description) { %> 
+                    <div class="description <%= data.descriptionClassName %>"><%= data.description %></div> 
+                <% } %>
+            <% } else if (data.hasOwnProperty('html')) { %>
+                <%= data.html %>"
+            <% } else if (data.image) { %>
+                <div style="background-image: url(<%= data.image %>)" class="image <%= data.imageClassName %>"></div>
+                <% if (data.title) { %>
+                    <div class="title <%= data.titleClassName %>"><%= data.title %></div>
+                <% } if (data.description) { %> 
+                    <div class="description <%= data.descriptionClassName %>"><%= data.description %></div> 
+                <% } %>
+            <% } else if (data.html) { %>
+                <%= data.html %>
+            <% } else if (data.item) { %>
+                <%= data.item %>
+            <% } else { %>
+                <%= '未找到渲染数据' %>
+            <% } %>
+            `
         }
 
         let body:JSX.Element | null = null;
@@ -270,7 +285,7 @@ export class Carousel extends React.Component<CarouselProps, CarouselState> {
                                 return (
                                     <div className={cx('Carousel-item', animationName, animationStyles[status])}>
                                         {render(`${current}/body`, itemSchema ? itemSchema : defaultSchema, {
-                                            data: isObject(option) ? option : {item: option}
+                                            data: createObject(data, isObject(option) ? option : {item: option})
                                         })}
                                     </div>
                                 );