diff --git a/src/rate/Rate.tsx b/src/rate/Rate.tsx
index 13b848696..1ac0d5295 100644
--- a/src/rate/Rate.tsx
+++ b/src/rate/Rate.tsx
@@ -87,7 +87,7 @@ export default defineComponent({
       props.readonly || props.disabled || !props.touchable;
 
     const list = computed<RateListItem[]>(() =>
-      Array(props.count)
+      Array(+props.count)
         .fill('')
         .map((_, i) =>
           getRateStatus(
diff --git a/src/rate/test/index.spec.ts b/src/rate/test/index.spec.ts
index b0dde45b6..a1ecabc08 100644
--- a/src/rate/test/index.spec.ts
+++ b/src/rate/test/index.spec.ts
@@ -127,3 +127,15 @@ test('should get decimal when using allow-half and readonly prop', () => {
   const halfIcon = wrapper.find('.van-rate__icon--half');
   expect(halfIcon.style.width).toEqual('0.3em');
 });
+
+test('should render correct count when using string prop', () => {
+  const wrapper = mount(Rate, {
+    props: {
+      count: '4',
+    },
+  });
+
+  const icons = wrapper.findAll('.van-rate__item');
+
+  expect(icons).toHaveLength(4);
+});