If I just add the code on the sidebar the console says that the field variable is undefined, so I've included a reference with the variable in the initial code block
@ -5,6 +5,10 @@ title: Binding to component instances
Just as you can bind to DOM elements, you can bind to component instances themselves. For example, we can bind the instance of `<InputField>` to a prop named `field` in the same way we did when binding DOM Elements
Just as you can bind to DOM elements, you can bind to component instances themselves. For example, we can bind the instance of `<InputField>` to a prop named `field` in the same way we did when binding DOM Elements
```html
```html
<script>
let field;
</script>
<InputFieldbind:this={field}/>
<InputFieldbind:this={field}/>
```
```
@ -16,4 +20,4 @@ Now we can programmatically interact with this component using `field`.
</button>
</button>
```
```
> Note that we can't do `{field.focus}` since field is undefined when the button is first rendered and throws an error.
> Note that we can't do `{field.focus}` since field is undefined when the button is first rendered and throws an error.