Comments (2)
Thanks for your contribution!
v-bind can not handle an dot attribute like .sync therefore I will add in next vFormBase.vue
<!-- DEFAULT all other Types -> typeToComponent -->
<div
:is="mapTypeToComponent(obj.schema.type)"
v-else
v-bind="bindSchema(obj)"
:type="checkExtensionType(obj)"
:value="setValue(obj)"
:obj="obj"
:search-input.sync="obj.schema.searchInput"
...
and the example 'Fetch Data on Search Input with Autocomplete or Combobox'
let autocomplete = null
let combobox = null
export default {
components: { VFormBase },
data () {
return {
myModel: {
combobox: null,
autocomplete: null
},
mySchema: {
combobox: {
type:'combobox',
items: this.items,
cacheItems:true,
searchInput: '',
},
autocomplete: {
type:'autocomplete',
items: this.items,
cacheItems:true,
searchInput: '',
}
},
states: [
'Alabama',
'Alaska',
// ...
'Wyoming',
]
}
},
watch: {
mySchema: {
deep: true,
async handler(val) {
if (val.autocomplete.searchInput !== autocomplete) {
val.autocomplete.items = await this.fetch(this.states.filter( i => i.includes(val.autocomplete.searchInput)));
autocomplete = val.autocomplete.searchInput
}
if (val.combobox.searchInput !== combobox) {
val.combobox.items = await this.fetch(this.states.filter( i => i.includes(val.combobox.searchInput)));
combobox = val.combobox.searchInput
}
}
}
},
methods: {
fetch(obj) {
return new Promise( (resolve, reject) => setTimeout(() => resolve(obj), 500) )
}
}
from vuetify-form-base.
See a working autocomplete example
from vuetify-form-base.
Related Issues (20)
- Clearing date picker doesn't clear the model value
- Failed to resolve directive: click-outside HOT 2
- How can I wrap the inputs in my own element?
- Vue3 + Vuetify3 HOT 5
- Typescript support HOT 1
- Why package.json scripts is empty?
- v-form-base not rendered in production mode HOT 2
- `pattern` doesn't allow for regex flags HOT 1
- Feature Request: Can you please add a "Description" field made of append icon with tooltip?
- Using axios api calls
- Custom Component With Slots
- Problem with label string
- Which Json Schema Library shoud I choose? HOT 1
- Hidden groups in an array
- Object Bindings
- How to bind properties? HOT 1
- How to disable the default no-gutters?
- Checkbox returns NULL when it should return FALSE HOT 3
- How to use v-form-base in a v-for loop? HOT 2
- Cant Render custom components HOT 4
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from vuetify-form-base.