vue-select-on-focus
Selects the text contents of inputs, textareas, and contenteditable elements on focus.
Install
$ npm install --save vue-select-on-focus or
$ yarn add vue-select-on-focus or include the UMD build, hosted by unpkg in a <script> tag.
<script src="//unpkg.com/vue-select-on-focus" />Usage
Globally
import Vue from "vue" import selectOnFocus from "vue-select-on-focus" Vue.use(selectOnFocus)Per-component
import selectOnFocus from "vue-select-on-focus" export default { directives: { selectOnFocus }, template: "<div><input type='text' value='Lorem Ipsum' v-select-on-focus /></div>" }The directive will work with any text input, textarea, or contenteditable element.
Passing a custom range
If you don't want to select all the text contents, you can pass in an object with start and end values to the directive.
import selectOnFocus from "vue-select-on-focus" export default { directives: { selectOnFocus }, template: "<div><input type='text' value='Lorem Ipsum' v-select-on-focus='customRange' /></div>", data() { return { customRange: { start: 2, end: 5 } } } }In this example the letters rem would be selected when the input is focused.
Development
# To run the example $ npm run example # To run the tests $ npm test # To publish the dist file $ npm run buildLicense
MIT © Collin Henderson
