首先在HarmonyOS中和vue不一样数据不是双向绑定。
为了页面简洁,样式相关代码一律忽略
on:change="changeUsername"
表示当输入框的值发送变化的时候调用对应函数changeUsername
html相关代码
<input type="text" placeholder="请输入手机号/邮箱/个人账号" on:change="changeUsername"/>
js相关代码
数据存放
data: {
user:{
username:'',
password:''
}
}
实现函数changeUsername。
event是函数自带的值。
changeUsername(event){//通过方法获得输入框的值
this.user.username = event.value;
}
一个login函数,里面包括http请求和router.push页面跳转
login(){
// 每一个httpRequest对应一个http请求任务,不可复用
let httpRequest = http.createHttp();
httpRequest.request(
// 填写http请求的url地址,可以带参数也可以不带参数。URL地址需要开发者自定义。请求的参数可以在extraData中指定
"EXAMPLE_URL",
{
method: http.RequestMethod.POST, // 可选,默认为http.RequestMethod.GET
// 开发者根据自身业务需要添加header字段
header: {
'Content-Type': 'application/json'
},
// 当使用POST请求时此字段用于传递内容
extraData: {
"data": "data to send",
},
connectTimeout: 60000, // 可选,默认为60s,连接超时时间
readTimeout: 60000, // 可选,默认为60s,读取超时时间
}, (err, data) => {//err成功与否,data后台服务器返回的结果
if (!err) {//成功
// data.result为http响应内容,可根据业务需要进行解析
console.info('Result:' + data.result);
console.info('code:' + data.responseCode);
// data.header为http响应头,可根据业务需要进行解析
console.info('header:' + JSON.stringify(data.header));
console.info('cookies:' + data.cookies); // 8+
} else {//失败
console.info('error:' + JSON.stringify(err));
// 当该请求使用完毕时,调用destroy方法主动销毁。
httpRequest.destroy();//对象销毁
}
}
);
router.push({
url:'pages/main/main'
});
}
js全部代码
import router from '@ohos.router'
import http from '@ohos.net.http';
export default {
data: {
user:{
username:'',
password:''
}
},
onInit() {
},
changeUsername(event){//通过方法获得输入框的值
this.user.username = event.value;
},
changePassword(event){//通过方法获得输入框的值
this.user.username = event.value;
},
login(){
// 每一个httpRequest对应一个http请求任务,不可复用
let httpRequest = http.createHttp();
httpRequest.request(
// 填写http请求的url地址,可以带参数也可以不带参数。URL地址需要开发者自定义。请求的参数可以在extraData中指定
"EXAMPLE_URL",
{
method: http.RequestMethod.POST, // 可选,默认为http.RequestMethod.GET
// 开发者根据自身业务需要添加header字段
header: {
'Content-Type': 'application/json'
},
// 当使用POST请求时此字段用于传递内容
extraData: {
"data": "data to send",
},
connectTimeout: 60000, // 可选,默认为60s,连接超时时间
readTimeout: 60000, // 可选,默认为60s,读取超时时间
}, (err, data) => {//err成功与否,data后台服务器返回的结果
if (!err) {//成功
// data.result为http响应内容,可根据业务需要进行解析
console.info('Result:' + data.result);
console.info('code:' + data.responseCode);
// data.header为http响应头,可根据业务需要进行解析
console.info('header:' + JSON.stringify(data.header));
console.info('cookies:' + data.cookies); // 8+
} else {//失败
console.info('error:' + JSON.stringify(err));
// 当该请求使用完毕时,调用destroy方法主动销毁。
httpRequest.destroy();//对象销毁
}
}
);
router.push({
url:'pages/main/main'
});
}
}
标签:info,console,err,header,代码,js,HarmonyOS,http,data
From: https://www.cnblogs.com/chuixulvcao/p/16975065.html