怎么解决这段报错Invalid prop: type check failed for prop "isLikinged". Expected Boolean, got Number with value -1. found in ---> <LikingCom> at src/components/likingCom.vue <ArticleIndex> at src/views/article/articleView.vue <App> at src/App.vue在<template> <div> <van-button class="starbtn" :icon="isLikinged ? 'good-job' : 'good-job-o'" type="primary" @click="LikingFn" :loading="likingLoading" /> <!-- <van-icon color="#777" name="good-job-o" /> --> </div> </template> <script> import { likingGoApi, likingOutApi } from "@/api/article"; export default { model: { prop: "isLikinged", event: "isLikingFn", //子组件触发的事件 }, props: { isLikinged: Boolean, artId: [Number, String], //作者id }, data() { return { likingLoading: false, //收藏按钮的loading }; }, methods: { async LikingFn() { // 收藏/取消收藏文章的点击方法 try { this.likingLoading = true; if (this.isLikinged) { // 为true的时候取关 await likingOutApi(this.artId); this.$toast.success("点赞成功"); } else { // 走关注接口 await likingGoApi(this.artId); this.$toast.success("取消点赞"); } this.likingLoading = false; // 关注或未关注,都要修改按钮的视图状态 // props单向数据流,不能在子组件修改,子向父 // this.$emit("isFollowedFn"); //this.$emit触发input自定义事件 // this.$emit("input", !this.value); this.$emit("isLikingFn", !this.isLikinged); } catch (error) { console.log(error); } }, }, }; </script> <style scoped lang="less"> /deep/.starbtn { background: #fff; border: 0px; color: #3a3a3a; .van-icon-star-o { color: #3a3a3a; } .van-icon-star { color: #ff9912; } } </style>代码里

这个报错是因为父组件给子组件传入了一个名为 `isLikinged` 的 prop，但是该 prop 的类型应该是 Boolean 类型，而实际传入的是一个 Number 类型的值 `-1`。你需要在父组件中检查并修正传递给子组件的 `isLikinged` 值，确保其为 Boolean 类型。

如果你确认传递给子组件 `LikingCom` 的 `isLikinged` 值是正确的，那么你可能需要检查子组件 `LikingCom` 中的代码，确保它正确处理了 `isLikinged` prop 的类型。你可以在子组件的 `props` 中指定 `isLikinged` 为 Boolean 类型，这样就可以在子组件中强制转换类型了。例如：

props: {
  isLikinged: {
    type: Boolean,
    default: false,
    required: true,
  },
},

这样在子组件中使用 `isLikinged` 属性时，就会被强制转换成 Boolean 类型，避免了类型错误的问题。

相关问题

uview 的 u-switch 报错Invalid prop: type check failed for prop "value". Expected Boolean, got Number with value 0.

根据提供的引用内容，uview的u-switch组件报错Invalid prop: type check failed for prop "value". Expected Boolean, got Number with value 0.，这是因为u-switch组件的value属性期望的是一个布尔值，但是传入的是一个数值类型。解决方法是将传入的数值类型转换为布尔值类型。以下是一个解决方案的示例代码：

<template>
  <u-switch :value="switchValue === 1" @change="onChange"></u-switch>
</template>

<script>
export default {
  data() {
    return {
      switchValue: 0
    }
  },
  methods: {
    onChange(value) {
      this.switchValue = value ? 1 : 0;
    }
  }
}
</script>

在上面的代码中，我们将switchValue属性的值设置为0或1，然后将其转换为布尔值类型传递给u-switch组件的value属性。在change事件中，我们将传入的布尔值类型转换为0或1，然后将其赋值给switchValue属性。

a-checkbox组件报错 Invalid prop: type check failed for prop "checked". Expected Boolean, got Number with value 0.

根据引用和引用，你遇到的问题是因为在使用antd-design-React前端框架渲染Select.Option时，数据从父组件传递到子组件时，你传递的值是数字而不是字符串。而在使用a-checkbox组件时，你传递的值为数字0，而a-checkbox组件期望的是布尔值。为了解决这个问题，你可以使用模板字符串将数字值转换为字符串。例如，在传递给a-checkbox组件之前，你可以将record.linkStatus包装为`${record.linkStatus}`的形式。这样就可以将数字0转换为字符串"0"，符合a-checkbox组件期望的布尔值类型。<span class="em">1</span><span class="em">2</span>
#### 引用[.reference_title]
- *1* *2* [解决前端警告： Warning: Failed prop type: Invalid prop value of type number supplied to Textinput](https://blog.csdn.net/who__are__you/article/details/118878812)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v92^chatsearchT3_1"}}] [.reference_item style="max-width: 100%"]
[ .reference_list ]