vuejs ref
<template>
<input ref="input">
</template>
<script>
export default {
methods: {
// used to put the focus on this field from the parent
focus() {
this.$refs.input.focus();
}
}
};
</script>vuejs ref
<template>
<input ref="input">
</template>
<script>
export default {
methods: {
// used to put the focus on this field from the parent
focus() {
this.$refs.input.focus();
}
}
};
</script>vuejs ref attribute
// Sometimes, you might want to access an element in child component from
// the parent component. e.g. You are in the parent compontent and you want
// focus on an input element in the child component
// Child component called "Todo"
<template>
<input ref='theInputToFocus' />
</template>
// In parent compoent called "TodoList"
<script>
export default {
methods: {
// When called, then focus on an input in the child element
focusOnChild() {
this.$refs.theInputToFocus.focus();
}
}
};
</script>
// Rules to use refs
// 1. Dont use it untill the element is rendered as it will not work.
// So use it after the "mounted" lifecycle hook
// 2. Dont use it in computed propertiesCopyright © 2021 Codeinu
Forgot your account's password or having trouble logging into your Account? Don't worry, we'll help you to get back your account. Enter your email address and we'll send you a recovery link to reset your password. If you are experiencing problems resetting your password contact us
