weixin_39831239
weixin_39831239
2021-01-07 11:52

[TypeScript] Props type infer

I met a problems here. And here is my solution. I wonder if there is any other solution which is better?


props:{
  src: { type: String, required: true }
},
setup(props){
    onMounted(() => {
      const img = new Image(); // Create new Image instance

      img.src = props.src as unknown as string;

      ...
    });
}

该提问来源于开源项目:vuejs/composition-api

  • 点赞
  • 写回答
  • 关注问题
  • 收藏
  • 复制链接分享
  • 邀请回答

13条回答

  • weixin_39538687 weixin_39538687 4月前

    Try v2.2.0.

    点赞 评论 复制链接分享
  • weixin_39831239 weixin_39831239 4月前

    🆗,I'll try ^-^

    点赞 评论 复制链接分享
  • weixin_39831239 weixin_39831239 4月前

    Excuse me ,waht's impoving? I cannot feel any enhancement. Could you tell me more specificitly? I stitll catch error whtn writing originally, yet I still needs to convert to unknown.

    点赞 评论 复制链接分享
  • weixin_39831239 weixin_39831239 4月前

    I noticed the provide/inject types improve, by checking your commits and I alse noticed an enhancement with states, but none about props.

    点赞 评论 复制链接分享
  • weixin_39538687 weixin_39538687 4月前

    Can you show me your codes? An online example would be great.

    点赞 评论 复制链接分享
  • weixin_39726044 weixin_39726044 4月前
    1. If you don't need typescript types
    typescript
    export default createComponent({
      setup(props) {
        return {}
      },
      props: {
        simple: {
          type: String,
          required: true
        },
      } as const
    })
    
    interface Props {
      simple: string
    }
    
    1. If you need typescript types
    typescript
    export default createComponent({
      setup(props) {
        return {}
      },
      props: ({
        advanced: {
          required: true
        },
      } as unknown) as Props
    })
    
    interface Props {
      advanced: {
        a: string
        b: number
      }
    }
    
    点赞 评论 复制链接分享
  • weixin_39831239 weixin_39831239 4月前

    THX very much

    点赞 评论 复制链接分享
  • weixin_39726044 weixin_39726044 4月前

    There was an error in my example, I've fixed it.

    点赞 评论 复制链接分享
  • weixin_39831239 weixin_39831239 4月前

    I got error when

    • as unknown as Props as const
    • as unknown as const as Props

    and no const effect when as const as unknown as Props

    So how should I do?

    点赞 评论 复制链接分享
  • weixin_39831239 weixin_39831239 4月前

    Oh thx, so when I want types I can not convert to const, is that right?

    点赞 评论 复制链接分享
  • weixin_39831239 weixin_39831239 4月前

    By the way, I don't think we need that parentheses(I am not sure whether I spell right). It seems ok when I remove it.

    点赞 评论 复制链接分享
  • weixin_39726044 weixin_39726044 4月前

    I don't use as const with interface Props If you want to be sure to not assign to props I think you can do as unknown as Readonly<Props>

    点赞 评论 复制链接分享
  • weixin_39726044 weixin_39726044 4月前

    My linter adds parenthesis but It's not required

    点赞 评论 复制链接分享

相关推荐