Hooks 11 exercises

Making a Read-Only Ref Mutable

Here we have a component with a useRef hook, where a string is passed as the type argument, and null is passed as the runtime argument.

export const Component = () => {
const ref = useRef<string>(null);
// Why is this not allowed?
ref.current = "Hello";
return null;

Loading exercise


0:00 In this exercise, we're inside a Component. We have a useRef here, where we're passing in string as the type argument, and we're also passing in as the runtime argument.

0:11 What's going on here? We should be able to assign to this, shouldn't we? If you hover over this, it's saying, "Cannot assign to 'current' because it is a read-only property."

0:21 Your job is to figure out what's going on here and how we can change this line of code to make sure that this ref is not read-only, that it's mutable. Good luck.