diff --git a/examples/routers/time.vue b/examples/routers/time.vue
index b97fd4c9..22627cd8 100644
--- a/examples/routers/time.vue
+++ b/examples/routers/time.vue
@@ -1,6 +1,6 @@
 <template>
     <div>
-        <Time />
+        <Time :time="1526552777" />
     </div>
 </template>
 <script>
diff --git a/src/components/time/time.vue b/src/components/time/time.vue
index f71f0d0a..72691b2e 100644
--- a/src/components/time/time.vue
+++ b/src/components/time/time.vue
@@ -1,5 +1,5 @@
 <template>
-    <span :class="classes" @click="handleClick">time</span>
+    <span :class="classes" @click="handleClick">{{ date }}</span>
 </template>
 <script>
     import Vue from 'vue';
@@ -51,7 +51,7 @@
                 if (this.hash !== '') window.location.hash = this.hash;
             },
             setTime () {
-
+                this.date = this.time;
             }
         },
         mounted () {
diff --git a/src/styles/components/index.less b/src/styles/components/index.less
index cb877ad4..3fae1162 100644
--- a/src/styles/components/index.less
+++ b/src/styles/components/index.less
@@ -44,3 +44,4 @@
 @import "avatar";
 @import "color-picker";
 @import "auto-complete";
+@import "time";
\ No newline at end of file
diff --git a/src/styles/components/time.less b/src/styles/components/time.less
new file mode 100644
index 00000000..70ce0639
--- /dev/null
+++ b/src/styles/components/time.less
@@ -0,0 +1,10 @@
+@time-prefix-cls: ~"@{css-prefix}time";
+
+.@{time-prefix-cls} {
+    &-with-hash{
+        cursor: pointer;
+        &:hover{
+            text-decoration: underline;
+        }
+    }
+}
\ No newline at end of file