使用vue的3.2.47的版本 + ts 打印props的值

假设你的组件名称为`MyComponent`，你可以按照以下方式打印`props`的值：

import { defineComponent, PropType } from 'vue'

export default defineComponent({
  name: 'MyComponent',
  props: {
    propA: {
      type: String,
      required: true
    },
    propB: {
      type: Number,
      default: 100
    }
  },
  setup(props) {
    console.log(props.propA)
    console.log(props.propB)
    return {}
  }
})

在`setup`函数中，我们可以直接访问`props`对象并打印其属性值。请注意，在Vue 3中，我们使用`defineComponent`函数来定义组件，并使用`PropType`类型来声明`props`属性的类型。

相关问题

vue3.2.47版本 + ts 打印props的值

在 Vue 3 的组件中，可以通过 `setup` 函数来访问 `props`。在 TypeScript 中，我们可以通过指定 `props` 的类型来获得类型检查和自动补全。以下是一个示例：

<template>
  <div>{{ message }}</div>
</template>

<script lang="ts">
import { defineComponent, PropType } from 'vue';

export default defineComponent({
  props: {
    message: {
      type: String,
      required: true
    }
  },
  setup(props) {
    console.log(props.message);
    return {};
  }
});
</script>

在上面的代码中，我们定义了一个 `message` 的 `prop`，它的类型为 `String`，是必需的。在 `setup` 函数中，我们可以通过 `props` 参数来访问 `props` 的值，并将其打印到控制台上。请注意，我们还需要从 Vue 中导入 `defineComponent` 和 `PropType`。

vue3.2在ts下如何让props有默认值

在 Vue 3 中使用 TypeScript，可以通过以下方式为 props 设置默认值：

1. 首先在 Vue 组件中定义 props：

import { defineComponent, PropType } from 'vue'

export default defineComponent({
  name: 'MyComponent',
  props: {
    message: {
      type: String as PropType<string>,
      default: 'Hello world!'
    }
  },
  // ...
})

2. 直接在 props 的类型定义中设置默认值：

import { defineComponent, PropType } from 'vue'

export default defineComponent({
  name: 'MyComponent',
  props: {
    message: {
      type: String as PropType<string>,
      default: 'Hello world!'
    }
  },
  // ...
})

注意：需要使用 `PropType` 来定义 props 的类型，将默认值直接设置在 props 的类型定义中即可。这种方式不需要转换默认值的类型，也更加简洁明了。