I'm having hard time on this.
My specific error is on this code: If I'll try to remove it everything works but I need to display the data columns. I don't understand why it cause an error.
<select>
<option v-for="column in columns">{{ column }}</option>
</select>
My app.js
import Vue from 'vue'
import DataViewer from './components/DataViewer.vue'
const app = new Vue({
el: '#app',
components: {
DataViewer
},
data: {
}
});
My DataViwer.vue
<template>
<div class="dv">
{{ title }}
</div>
<select>
<option v-for="column in columns">{{ column }}</option>
</select>
</template>
<script type="text/javascript">
import Vue from 'vue'
import axios from 'axios'
export default {
props: ['source', 'title'],
data(){
return {
model: {},
columns: {}
}
},
created(){
this.fetchIndexData()
},
methods: {
fetchIndexData(){
var vm = this
axios.get(this.source)
.then(function(response){
Vue.set(vm.$data, 'model', response.data.model)
Vue.set(vm.$data, 'columns', response.data.columns)
console.log(vm.$data.columns);
})
.catch(function(response){
console.log(response)
})
}
}
}
</script>
My ajax results:
I had the same warn and I found this decision: http://github.com.proxy.parle.co/ElemeFE/element/issues/4137
<el-tag v-for="tag in tags">
=>
<el-tag v-for="(tag, index) in tags" :key="index">
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With