Subscribe on changes!

prop `boolean` required type error

avatar
liuzw2579
Jul 27th 2023

Vue version

3.3.4

Link to minimal reproduction

https://play.vuejs.org/#eNp9UsFOwzAM/RWTy0Aam2C3qUwChAQcAAESl1zK6pZAmoQ4GUNV/x03ZR2T0JRL/OznPD+nEefOTVYRxVxIszkZLb1yAQhDdKBzU51JEUiKhTSqdtYHaCB8O4QHb90zX8bgsYQWSm9rGHG/UddnaQ0FcFxDcAYFlspgx6DDRhqA15M5XFirMTfjFJ8OMeQ09M5ee2zRF83mkNiQFOx2AJbxGZXHYg5lrgl/UX46jzr8gh3Wpgyxgqfglan6kAX04c77lCCevT3aTlVTxTPx1Ieja9Tawov1ujgYcUk27f1jBgcBa6fzgBwBZG8ni6ZJ5LbNphwlVBkXA6yOa1ugZq85n8zOpgNbjHkD/HSpqsk7WcMLSzZIsbS1Uxr9vQuKpUkxGCRFzsq+bhMWfNzYwZw3XH78g7/TusOkePBI6FcoxZALua8w9Omrpztc831IsvKouXpP8hHJ6thp7MsuoilY9p+6pPYmfTA2/Jmu1gENbYbqhG5XJwX/sss9o2/lziazxOMFivYHQQ360g==

Steps to reproduce

image

What is expected?

属性 b1、b2、b3 的 required 不一致。

What is actually happening?

属性 b1、b2、b3 的 required 一致。

System Info

No response

Any additional comments?

No response

avatar
Shyam-Chen
Jul 27th 2023

Required:

<script lang="ts" setup>
const props = defineProps<{
  b1: boolean;
  b2: boolean;
  b3: boolean;
  s1: string;
  s2: string;
}>();
</script>

Optional:

<script lang="ts" setup>
const props = defineProps<{
  b1?: boolean;
  b2?: boolean;
  b3?: boolean;
  s1?: string;
  s2?: string;
}>();
</script>
avatar
caohongz
Jul 28th 2023

PropType一般用于定义复杂变量（例如：数组、对象、函数）的类型定义，布尔类型或字符串类型直接定义即可，PropType会造成prop变量接口定义为可选变量。

avatar
yangliguo7
Aug 11th 2023

also confuse here

Is the type returned by DefineProps generated by this Readonly<ExtractPropTypes<{ x:Boolean }>> ?

check the mini RP

https://www.typescriptlang.org/play?#code/C4TwDgpgBACgTgezAWQsAFggJgHgCoA0UeAwggHYDOwcArgMbAJxQC8UAhuSAHxtQBtPAF0oEAB7AI5LJUEAoKFAAUygHQaOcAOaUAXJ24BKNny4gTAHyi0ZEAGYBLchCzzRAeg9RH9n3PtbRkcKKAB3RwxOHUoiDgAbeIQI8m0ocgoAWjgIAEdaRxysKEDyYIpKRSgAfigAb3SIMJUjA1IKmgYmOABuFra+nI4sCniQKDBEJlBINrIqTsZmKABfKC8oEiGpKAAxIOAQ8ih4xwBraHoOuiW4KoMXADcIO-kJMGZgKBnoABEOYAcfgAJQgVzguGocGc2iItjOGTC5B48nkP1giDA8yhXWY+H45j4rCq1gaLma6k0MQM5gEwlaxCgADJ6msViT6v1GeylNZ4EhUBhsPgUWjwH8HBxaPFgLsOLcQCL+MpJkh9FB-oCTKw+HgoNZyNL4vqbHYnC43GLIBikHhxUr2PysddcXAlXzMdjFt0RXTUc4pHB7PLoE6APJgQ4VfHscxEX78PB8OpVH7VAxOu2Qd3fOjQA1Gqo5fKFVzpqAAIwQCHiEC4VSwkulwHLCesvybMrlCpwvz4BcSJtsjfNrhNCArACswcAqo8Eo4sADmNVlPP4rQIAZ4YjyAyqzW6+R5OyraHMfh44miTawBGo1RLxr+7esxARaj0fejgkANIQEBKAdKAAFFxHoDdGxwC4QAQPxCCgUESyKf9AJFUV0QASXIewXkze0k34IRRAkKQZDkARDUSYQqlqcx1m8KjjRZTpoDCBBpWKYNHGNJgfBwl57kEEQxEkaRZEEBofgeI0TVY1YaKUOjuAYqAAEE5DwABlfxKE3KB0GAYAwH0LxtEidBaArNQrgAWw8ZBHHoRBKDg4APDfLTnMcSMPEcSg9IgSgPAARgAFgADgAJgATlU1zbIgTBmgAAzDKcZy9G5uhS8J0GkfjcLgIoSkQWzOWUBk9TWCswQQRK5BS8xco2FKACFq1rLgstdXKwny45nCKkr7DK28etuZQIiiJ1BUwLATFquygqgdrOqPFKhOI0SyIkgR0unRgJu6E0pPFAwDsyl1bgU2jELqiEcChGE4m4FElAMbbSPEiiOsPbrrpO0lvnOqA-q68hjuWFZFJqSt1vrD7hJIsTyMETUIChlhgekjUAUxwHodh2oMa2kTvrRgRlCGl4oAAVSMOlTpB2YVBplgGaZmG7rpnafrxqQsaqJSBfzKBsKK-Dszp96lCgAwJbwzE3xwGWyZR3aKKdHB2agAA1Ihdb7YnTQRZJjgpiS9eFuHMPsNTuBwA39fjWWketpG8FRd5PhZ6A7YdxUEIATSIAA5G8AAY+bR5QQuZYgTFqYP5agMPP3Fe7kNcVCgMI9gUyUARf34qAYLg4hhDaYuNZ+m3geLAoigMeSeTl4GRylGUaRUtulA2EZyAAci+WytDOMGEeOVUTM4ORhwcZxXHryf-shwm7jl5ncfBo8sdWG3ajwGuY4khpO+bbczSX4prFUbU+AX0cFoPreRaeQS39T38bYeCBnjuCsAQ5d4I0TPKBSQcB5TAClkFHAYYbyF1UrQSg0AUogNgE5M48CiBISbjnACQEEE8Fys4agdZigVxSng0sWBc7wJId8BAUA9JgA+HAL4mFfggRKHWYAtAciVCLiXZwZcAIVxgFgnBWd8F0MIQwngVdxYCTgLA+BNcURrBZEgjYKC0EYMkfQbBYYiDfgoH+eRxDSELAoVAKhZjyAWLQgg3KfFWHsM4dw3hAIBFBSqMXUuBipEmKgA4pxRCeCKPLIrVRyt7Rhg0Seb24gPF+02PVD4LhyDAEuowJ0lAHFARgPwTUHBEH+JEccAxSjtYwA0SaJiSTUQbH6uMDA0BxATExOkBAXxG60JqOAgAGiCChoxFRgRoNA2BQEGjiD0LvLgqxImoiAA

why the x prop is optional not required ?

avatar
caohongz
Aug 11th 2023

also confuse here

Is the type returned by DefineProps generated by this Readonly<ExtractPropTypes<{ x:Boolean }>> ?

check the mini RP

https://www.typescriptlang.org/play?#code/C4TwDgpgBACgTgezAWQsAFggJgHgCoA0UeAwggHYDOwcArgMbAJxQC8UAhuSAHxtQBtPAF0oEAB7AI5LJUEAoKFAAUygHQaOcAOaUAXJ24BKNny4gTAHyi0ZEAGYBLchCzzRAeg9RH9n3PtbRkcKKAB3RwxOHUoiDgAbeIQI8m0ocgoAWjgIAEdaRxysKEDyYIpKRSgAfigAb3SIMJUjA1IKmgYmOABuFra+nI4sCniQKDBEJlBINrIqTsZmKABfKC8oEiGpKAAxIOAQ8ih4xwBraHoOuiW4KoMXADcIO-kJMGZgKBnoABEOYAcfgAJQgVzguGocGc2iItjOGTC5B48nkP1giDA8yhXWY+H45j4rCq1gaLma6k0MQM5gEwlaxCgADJ6msViT6v1GeylNZ4EhUBhsPgUWjwH8HBxaPFgLsOLcQCL+MpJkh9FB-oCTKw+HgoNZyNL4vqbHYnC43GLIBikHhxUr2PysddcXAlXzMdjFt0RXTUc4pHB7PLoE6APJgQ4VfHscxEX78PB8OpVH7VAxOu2Qd3fOjQA1Gqo5fKFVzpqAAIwQCHiEC4VSwkulwHLCesvybMrlCpwvz4BcSJtsjfNrhNCArACswcAqo8Eo4sADmNVlPP4rQIAZ4YjyAyqzW6+R5OyraHMfh44miTawBGo1RLxr+7esxARaj0fejgkANIQEBKAdKAAFFxHoDdGxwC4QAQPxCCgUESyKf9AJFUV0QASXIewXkze0k34IRRAkKQZDkARDUSYQqlqcx1m8KjjRZTpoDCBBpWKYNHGNJgfBwl57kEEQxEkaRZEEBofgeI0TVY1YaKUOjuAYqAAEE5DwABlfxKE3KB0GAYAwH0LxtEidBaArNQrgAWw8ZBHHoRBKDg4APDfLTnMcSMPEcSg9IgSgPAARgAFgADgAJgATlU1zbIgTBmgAAzDKcZy9G5uhS8J0GkfjcLgIoSkQWzOWUBk9TWCswQQRK5BS8xco2FKACFq1rLgstdXKwny45nCKkr7DK28etuZQIiiJ1BUwLATFquygqgdrOqPFKhOI0SyIkgR0unRgJu6E0pPFAwDsyl1bgU2jELqiEcChGE4m4FElAMbbSPEiiOsPbrrpO0lvnOqA-q68hjuWFZFJqSt1vrD7hJIsTyMETUIChlhgekjUAUxwHodh2oMa2kTvrRgRlCGl4oAAVSMOlTpB2YVBplgGaZmG7rpnafrxqQsaqJSBfzKBsKK-Dszp96lCgAwJbwzE3xwGWyZR3aKKdHB2agAA1Ihdb7YnTQRZJjgpiS9eFuHMPsNTuBwA39fjWWketpG8FRd5PhZ6A7YdxUEIATSIAA5G8AAY+bR5QQuZYgTFqYP5agMPP3Fe7kNcVCgMI9gUyUARf34qAYLg4hhDaYuNZ+m3geLAoigMeSeTl4GRylGUaRUtulA2EZyAAci+WytDOMGEeOVUTM4ORhwcZxXHryf-shwm7jl5ncfBo8sdWG3ajwGuY4khpO+bbczSX4prFUbU+AX0cFoPreRaeQS39T38bYeCBnjuCsAQ5d4I0TPKBSQcB5TAClkFHAYYbyF1UrQSg0AUogNgE5M48CiBISbjnACQEEE8Fys4agdZigVxSng0sWBc7wJId8BAUA9JgA+HAL4mFfggRKHWYAtAciVCLiXZwZcAIVxgFgnBWd8F0MIQwngVdxYCTgLA+BNcURrBZEgjYKC0EYMkfQbBYYiDfgoH+eRxDSELAoVAKhZjyAWLQgg3KfFWHsM4dw3hAIBFBSqMXUuBipEmKgA4pxRCeCKPLIrVRyt7Rhg0Seb24gPF+02PVD4LhyDAEuowJ0lAHFARgPwTUHBEH+JEccAxSjtYwA0SaJiSTUQbH6uMDA0BxATExOkBAXxG60JqOAgAGiCChoxFRgRoNA2BQEGjiD0LvLgqxImoiAA

why the x prop is optional not required ?

In my opinion, props in vue3 are defined as optional.

GitHub Track