diff --git a/packages/components/timeline/__tests__/timeline.test.ts b/packages/components/timeline/__tests__/timeline.test.ts
index 27a6899b5f..dbc6b65130 100644
--- a/packages/components/timeline/__tests__/timeline.test.ts
+++ b/packages/components/timeline/__tests__/timeline.test.ts
@@ -74,6 +74,7 @@ describe('TimeLine.vue', () => {
       `,
       data() {
         return {
+          iconMoreFilled: markRaw(MoreFilled),
           activities: [
             {
               content: 'Step 1: xxxxxx',
@@ -112,6 +113,7 @@ describe('TimeLine.vue', () => {
       `,
       data() {
         return {
+          iconMoreFilled: markRaw(MoreFilled),
           activities: [
             {
               content: 'Step 1: xxxxxx',
@@ -257,6 +259,7 @@ describe('TimeLine.vue', () => {
       `,
       data() {
         return {
+          iconMoreFilled: markRaw(MoreFilled),
           activities: [
             {
               content: 'Step 1: xxxxxx',
diff --git a/packages/components/timeline/src/timeline-item.vue b/packages/components/timeline/src/timeline-item.vue
index c7fe3dcbd3..bfb7f1a0cd 100644
--- a/packages/components/timeline/src/timeline-item.vue
+++ b/packages/components/timeline/src/timeline-item.vue
@@ -43,23 +43,16 @@
   </li>
 </template>
 
-<script lang="ts">
-import { defineComponent } from 'vue'
+<script lang="ts" setup>
 import { ElIcon } from '@element-plus/components/icon'
 import { useNamespace } from '@element-plus/hooks'
 import { timelineItemProps } from './timeline-item'
 
-export default defineComponent({
+defineOptions({
   name: 'ElTimelineItem',
-  components: {
-    ElIcon,
-  },
-  props: timelineItemProps,
-  setup() {
-    const ns = useNamespace('timeline-item')
-    return {
-      ns,
-    }
-  },
 })
+
+defineProps(timelineItemProps)
+
+const ns = useNamespace('timeline-item')
 </script>