Vue.js crud javascript?
我需要将数据加载到实际操作表中 当我使用:Vue.js crud javascript?,javascript,vue.js,axios,handsontable,Javascript,Vue.js,Axios,Handsontable,我需要将数据加载到实际操作表中 当我使用: 案例:如果直接使用到数据中,效果很好,但我需要在使用Axios从Axios创建数据时加载数据。这不管用 案例:如果在我的变量信息中使用,它也不起作用 案例:使用创建的钩子。这不管用 从'@handsontable/vue'导入{HotTable}; 从“Handsontable”导入Handsontable; 导出默认值{ 已创建:函数(){ 这是newData() }, 数据:函数(){ 返回{ 信息:[], 热设置:{ 数据:this.info,
从'@handsontable/vue'导入{HotTable};
从“Handsontable”导入Handsontable;
导出默认值{
已创建:函数(){
这是newData()
},
数据:函数(){
返回{
信息:[],
热设置:{
数据:this.info,
colHeaders:['ID','Name','pain'],
行标题:对,
麻雀:2,
明科尔斯:3,
}
}
},
方法:{
新数据(){
//不要工作1rs,
this.info=['a','b','c',['ra','rb','rc'];
//不要工作,改变2dn
//设urlsecciones='seccion/show';
//get(urlsecciones)。然后(response=>{
//this.info=response.data;
//console.log(response.data)//运行良好
// });
}
},
组成部分:{
热桌
}
}
您不能在它们之间引用数据属性,而是可以使用计算属性来处理所需的内容:
newvue({
el:“应用程序”,
已创建:函数(){
这是newData()
},
数据(){
返回{
信息:[],
}
},
计算:{
热设置(){
返回{
数据:this.info,
colHeaders:['ID','Name','pain'],
行标题:对,
麻雀:2,
明科尔斯:3,
}
}
},
方法:{
新数据(){
this.info=[
[“a”、“b”、“c”],
[“ra”、“rb”、“rc”]
]
//在这里处理Axios逻辑
}
},
组成部分:{
“hottable”:Handsontable.vue.hottable
}
});代码>
请不要链接外部站点,而是使用SO中内置的调试器。谢谢看小提琴@CarlosHi@HansFelixRamos你能帮我吗
data: function() {
return {
info:[],
hotSettings: {
data: [['a','b','c'],['ra','rb','rc']],
}
}
}
data: function() {
return {
info:[['a','b','c'],['ra','rb','rc']],
hotSettings: {
data: this.info,
}
}
}
<template>
<div>
<hot-table ref="hotTableComponent" :settings="hotSettings"></hot-table>
</div>
</template>
<script>
import { HotTable } from '@handsontable/vue';
import Handsontable from 'handsontable';
export default {
created: function (){
this.newData()
},
data: function() {
return {
info:[],
hotSettings: {
data: this.info,
colHeaders: ['ID','Name',' pain'],
rowHeaders: true,
minRows: 2,
minCols: 3,
}
}
},
methods: {
newData() {
//dont work 1rs,
this.info = ['a','b','c'],['ra','rb','rc']];
// don't work, change 2dn
// let urlsecciones = 'seccion/show';
// axios.get(urlsecciones).then(response => {
// this.info = response.data;
// console.log(response.data) // run good
// });
}
},
components: {
HotTable
}
}
</script>