刚学uniapp请教下。我下面的getdata函数哪里定义错了?无法调用
<template> <view>
<view v-for="(item,index) in a2" class="box1" :for="index">
<view :style="item.l11_30==true?'background-color:#FFB9DC':'background-color:#CCCCCC'">
<view class="box2"><text Selection space="ensp">借用时间:{{item.l11_4}} text>view>
<view class="box3"><text Selection space="ensp">记单人:{{item.l11_14}}text>view>
<view class="box2"><text Selection space="ensp">借用人:{{item.l11_10}} text>view>
<view class="box3"><text Selection space="ensp">借用教室:{{item.l11_11}}text>view>
<view class="box2"><text Selection space="ensp">借用周:{{item.l11_17}} text>view>
<view class="box3"><text Selection space="ensp">借用星期:{{item.l11_15}}text>view>
<view class="box2"><text Selection space="ensp">借用课次:{{item.l11_18}} text>view>
<view class="box3"><text Selection space="ensp">借用时间段:{{item.l11_12}}text>view>
<view class="box2"><text Selection space="ensp">备注:{{item.l11_8}} text>view>
view>
view>
view>
template>
<script>
export default {
data(){
return{
bga:'#CCCCCC',
bgb:'#FFB9DC',
ac:'true',
a2:[],
}
},
getdata (){
//开始请求服务器数据开始
uni.request({
url:'http://localhost/app/1.asp',
data: {
id1:'2',
id2:'addoil',
},
method: 'post',
header: {
'content-type': 'application/x-www-form-urlencoded',
},
success: (res) => {
console.log(res.data)
this.a2 = res.data;
}
})
//开始请求服务器数据结束
},
// 触底的事件
onReachBottom() {
console.log('到了')
// 让页码值自增 +1
//this.queryObj.pagenum += 1
},
onShow: function() {
getData() //调用加载数据方法
},
}
script>
<style>
.box1{
margin-top: 15rpx;
font-size: 25rpx;
border:1px solid rgb(150,150,150);
border-radius:2px;
width: 735rpx;
margin-left: 5rpx;
display: centn;
}
.box2{
text-align: left;
}
.box3{
text-align:left;
}
style>
<script>
export default {
data(){
return{
bga:'#CCCCCC',
bgb:'#FFB9DC',
ac:'true',
a2:[],
}
},
methods:{ // methods包裹函数
getdata (){
//开始请求服务器数据开始
uni.request({
url:'http://localhost/app/1.asp',
data: {
id1:'2',
id2:'addoil',
},
method: 'post',
header: {
'content-type': 'application/x-www-form-urlencoded',
},
success: (res) => {
console.log(res.data)
this.a2 = res.data;
}
})
//开始请求服务器数据结束
},
// 触底的事件
onReachBottom() {
console.log('到了')
// 让页码值自增 +1
//this.queryObj.pagenum += 1
},
onShow: function() {
this.getData() //调用加载数据方法
},
}
}
</script>
首先你要知道uniapp 是基于vue实现的多端兼容的这么一个框架。所以它的写法基本和vue没有区别。vue中定义函数需要写在 methods对象中。还有要养成格式化的习惯...
<script>
export default {
data(){
return{
bga:'#CCCCCC',
bgb:'#FFB9DC',
ac:'true',
a2:[],
}
},
methods:{ // methods包裹函数
getdata (){
//开始请求服务器数据开始
uni.request({
url:'http://localhost/app/1.asp',
data: {
id1:'2',
id2:'addoil',
},
method: 'post',
header: {
'content-type': 'application/x-www-form-urlencoded',
},
success: (res) => {
console.log(res.data)
this.a2 = res.data;
}
})
//开始请求服务器数据结束
},
// 触底的事件
onReachBottom() {
console.log('到了')
// 让页码值自增 +1
//this.queryObj.pagenum += 1
},
onShow: function() {
getData() //调用加载数据方法
},
}
}
</script>
改成下面就不报错。但调用就报错
```bash
<script>
export default {
data(){
return{
a2:[],
}
},
getdata:function(){//开始请求服务器数据开始
uni.request({
url:'http://localhost/app/1.asp',
data: {
id1:'2',
id2:'addoil',
},
method: 'post',
header: {
'content-type': 'application/x-www-form-urlencoded',
},
success: (res) => {
console.log(res.data)
this.a2 = res.data;
}
})
//开始请求服务器数据结束
},
// 触底的事件
onReachBottom() {
console.log('到了')
this.a2=[...this.a2,...[a2]]
// 让页码值自增 +1
//this.queryObj.pagenum += 1
},
onShow: function() {
getData() //调用加载数据方法
},
}
</script>
| ^
vendor.js?t=wechat&s=1674964565968&v=0370c81b8eff0377ed9406ead7b2d02a:3963 [Vue warn]: Error in onShow hook: "ReferenceError: getData is not defined"
(found in pages/jsjy/index.vue)(env: Windows,mp,1.06.2209190; lib: 2.28.1)
warn @ vendor.js?t=wechat&s=1674964565968&v=0370c81b8eff0377ed9406ead7b2d02a:3963
Vue.config.errorHandler @ vendor.js?t=wechat&s=1674964565968&v=0370c81b8eff0377ed9406ead7b2d02a:9178
globalHandleError @ vendor.js?t=wechat&s=1674964565968&v=0370c81b8eff0377ed9406ead7b2d02a:5227
handleError @ vendor.js?t=wechat&s=1674964565968&v=0370c81b8eff0377ed9406ead7b2d02a:5196
invokeWithErrorHandling @ vendor.js?t=wechat&s=1674964565968&v=0370c81b8eff0377ed9406ead7b2d02a:5219
Vue.__call_hook @ vendor.js?t=wechat&s=1674964565968&v=0370c81b8eff0377ed9406ead7b2d02a:9242
_vue.default.__call_hook @ vendor.js?t=wechat&s=1674964565968&v=0370c81b8eff0377ed9406ead7b2d02a:1947
mpOptions.<computed> @ vendor.js?t=wechat&s=1674964565968&v=0370c81b8eff0377ed9406ead7b2d02a:1461
(anonymous) @ WASubContext.js?t=wechat&s=1674964565968&v=2.28.1:1
l.__callPageLifeTime__ @ WASubContext.js?t=wechat&s=1674964565968&v=2.28.1:1
(anonymous) @ WASubContext.js?t=wechat&s=1674964565968&v=2.28.1:1
(anonymous) @ WASubContext.js?t=wechat&s=1674964565968&v=2.28.1:1
(anonymous) @ WASubContext.js?t=wechat&s=1674964565968&v=2.28.1:1
(anonymous) @ WASubContext.js?t=wechat&s=1674964565968&v=2.28.1:1
wr @ WASubContext.js?t=wechat&s=1674964565968&v=2.28.1:1
(anonymous) @ WASubContext.js?t=wechat&s=1674964565968&v=2.28.1:1
l.emit @ WAServiceMainContext.js?t=wechat&s=1674964565968&v=2.28.1:1
emit @ WAServiceMainContext.js?t=wechat&s=1674964565968&v=2.28.1:1
(anonymous) @ WAServiceMainContext.js?t=wechat&s=1674964565968&v=2.28.1:1
(anonymous) @ WAServiceMainContext.js?t=wechat&s=1674964565968&v=2.28.1:1
l.emit @ WAServiceMainContext.js?t=wechat&s=1674964565968&v=2.28.1:1
emit @ WAServiceMainContext.js?t=wechat&s=1674964565968&v=2.28.1:1
(anonymous) @ WAServiceMainContext.js?t=wechat&s=1674964565968&v=2.28.1:1
(anonymous) @ WAServiceMainContext.js?t=wechat&s=1674964565968&v=2.28.1:1
emit @ WAServiceMainContext.js?t=wechat&s=1674964565968&v=2.28.1:1
c @ VM18467 asdebug.js:10
u @ VM18467 asdebug.js:10
(anonymous) @ VM18467 asdebug.js:1
f @ VM18467 asdebug.js:1
g @ VM18467 asdebug.js:1
(anonymous) @ VM18467 asdebug.js:1
_ws.onmessage @ VM18467 asdebug.js:1
Show 2 more frames
vendor.js?t=wechat&s=1674964565968&v=0370c81b8eff0377ed9406ead7b2d02a:9179 ReferenceError: getData is not defined
at VueComponent.onShow (index.js?t=wechat&s=1674964565968&v=2890116f402dd9aa32a5cad00d350f57:207)
at invokeWithErrorHandling (vendor.js?t=wechat&s=1674964565968&v=0370c81b8eff0377ed9406ead7b2d02a:5211)
at VueComponent.Vue.__call_hook (vendor.js?t=wechat&s=1674964565968&v=0370c81b8eff0377ed9406ead7b2d02a:9242)
at VueComponent._vue.default.__call_hook (vendor.js?t=wechat&s=1674964565968&v=0370c81b8eff0377ed9406ead7b2d02a:1947)
at da.mpOptions.<computed> [as onShow] (vendor.js?t=wechat&s=1674964565968&v=0370c81b8eff0377ed9406ead7b2d02a:1461)
at da.<anonymous> (WASubContext.js?t=wechat&s=1674964565968&v=2.28.1:1)
at da.l.__callPageLifeTime__ (WASubContext.js?t=wechat&s=1674964565968&v=2.28.1:1)
at WASubContext.js?t=wechat&s=1674964565968&v=2.28.1:1
at WASubContext.js?t=wechat&s=1674964565968&v=2.28.1:1
at WASubContext.js?t=wechat&s=1674964565968&v=2.28.1:1(env: Windows,mp,1.06.2209190; lib: 2.28.1)
```
首先定义方法要写到 methods 中,其次,调用方法要写 this.getData()