React-hook-form image

const ImageUploader = ({
  errorMessage, name, watch, register, validationRules
}: TProps) => (
  <Container>
    <Col1>
      <Title>Choose logo</Title>
      <input
        type="file"
        accept=".jpg,.jpeg,.png"
        {...register(name, {
          required: true,
          pattern: {
            value: validationRules,
            message: errorMessage
          }
        })}
        name={name}
      />
      <span>{errorMessage}</span>
    </Col1>
    <Image
      alt="default"
      src={
        watch === undefined || watch.length === 0
          ? 'https://upload.wikimedia.org/wikipedia/commons/7/78/Image.jpg'
          : URL.createObjectURL(watch[0])
      }
    />
  </Container>
)

Similar codes

0 vote376 views1 answer
@tippyjs/react
Javascript React
1 vote312 views1 answer
How to use array of object in react
Javascript React
18 votes304 views6 answers
Add svg in react
Javascript React
2 votes395 views2 answers
Property 'name' does not exist on type 'eventtarget' react
Javascript React
-1 vote365 views1 answer
React slick npm
Javascript React
0 vote329 views2 answers
Airbnb react native eslint
Javascript React
0 vote398 views1 answer
React flip move
Javascript React
0 vote316 views1 answer
How to enable emit on react in vs code
Javascript React
1 vote395 views2 answers
[HomePage] is not a <Route> component. All component children of <Routes> must be a <Route> or <React.Fragment>
Javascript React
23 votes341 views3 answers
Copy text to clipboard javascript react
Javascript React