表结构
wxml页面
<form bindsubmit="formAdd" >
照片<l-image-picker count="9" bind:linchange="onChangeTap" />
<l-input label="标题" placeholder="请输入标题" name="code" bind:lininput="code" />
<l-input label="内容" placeholder="请输入内容" name="name" bind:lininput="name" />
请选择地址<l-button type="default" bindtap='map' bind:lininput="city" name="city">{{city}}</l-button>
<view class="section">
<view class="section__title">爱好</view>
<picker bindchange="bindPickerChange" name="u_name" value="{{index}}" range="{{text}}" range-key="u_name">
<view class="picker">
当前选择:{{index}}
</view>
</picker>
</view>
<view>
<picker mode="region" bindchange="bindRegionChange" value="{{region}}">
<text wx:if="{{region==''}}">请选择省市区</text>
<text wx:if="{{region!=''}}">{{region[0]}}、{{region[1]}}、{{region[2]}}</text>
</picker>
</view>
<button type="default" form-type="submit">添加</button>
</form>
js页面
// pages/city/city.js
import "../../utils/WxValidate"
Page({
/**
* 页面的初始数据
*/
data: {
address:'选择位置',
region: [],// 选中的数据
name:'',
designation:'',
number:'',
show:0,
text:[]
},
TimeID:-1,
/**
* 生命周期函数--监听页面加载
*/
onLoad: function (options) {
},
map() {
wx.chooseLocation({
success: result => {
this.setData({
city:result.address+result.name
})
},
})
},
//文件上传之后的方法
onChangeTap(event) {
//获取最新上传的所有图片临时路径
let tempFilePaths = event.detail.current;
//定义一个空数组,进行存放上传图片url
var urlArr = [];
for (let index = 0; index < tempFilePaths.length; index++) {
wx.uploadFile({
url: 'http://www.tp.com/admin/upload', //仅为示例,非真实的接口地址
filePath: tempFilePaths[index],
name: 'file',
header:{
'token':wx.getStorageSync('token')
},
success: res => {
const data = JSON.parse(res.data);
//do something
urlArr.push(data.url)
this.setData({
urls: urlArr
})
}
})
}
},
//点击确定按钮
bindRegionChange: function (e) {
this.setData({
region: e.detail.value
})
},
bindPickerChange: function(e) {
let data = this.data.text[e.detail.value]['u_name']
this.setData({
index: data
})
},
code(code){
this.setData({
code:code.detail.value
})
},
name(name){
this.setData({
name:name.detail.value
})
},
region(region){
this.setData({
region:region.detail.value
})
},
city(city){
this.setData({
city:city.detail.value
})
},
date(date){
console.log(date.detail.value)
this.setData({
date:date.detail.value
})
},
//成功提交按钮
formAdd:function(e){
console.log(e)
let name = this.data.name;
let city=this.data.city;
let region=this.data.region;
let code=this.data.code;
let date=e.detail.value.date;
let u_name=this.data.index;
console.log(e);
clearTimeout(this.TimeID);
this.TimeID = setTimeout(() => {
//4.准备发送请求获取数据
wx.request({
})
},1000);
wx.request({
url: 'http://www.tp.com/admin/county',
header:{
'token':wx.getStorageSync('token')
},
method:"POST",
data:{
name:name,
city:city,
date:date,
region:region,
code:code,
u_name:u_name,
},
success:res=>{
let msg= res.data.msg
if(msg=="添加成功"){
this.setData({
show:1,
}),wx.navigateTo({
url: '/pages/mys/mys',
})
}
}
})
},
})
json页面
{
"usingComponents": {
"l-input":"/miniprogram_npm/lin-ui/input",
"l-image-picker":"/miniprogram_npm/lin-ui/image-picker",
"l-button":"/miniprogram_npm/lin-ui/button",
"l-steps":"/miniprogram_npm/lin-ui/steps",
"l-step":"/miniprogram_npm/lin-ui/step"
}
}
文件上传
public function County(Request $request)
{
$data=input('post.');
$region = input('post.region');
$nameen = json_decode($region,true);
$data['province']=$region[0];
//市
$data['citys']=$region[1];
//区
$data['area']=$region[2];
if($data){
try {
validate(FangVaildate::class)->check([
'name' => $data['name'],
'city'=>$data['city'],
'code'=>$data['code']
]);
} catch (ValidateException $e) {
// 验证失败 输出错误信息
dump($e->getError());
}
}
$info=Price::create($data);
if($info){
return json(['code'=>'200','msg'=>'添加成功','data'=>$info]);
}
}
列表页面
<l-card type="avatar" wx:for="{{text}}" l-class="card" image="{{item.image}}"
title="{{item.name}}" describe="18个小时前">
<!-- 此处为content -->
<view class="avter-content">
<navigator url="/pages/mysfind/mysfind?id={{item.id}}">
地址:{{item.city}}
爱好:{{item.u_name}}
</navigator>
</view>
<view class="avter-share-container">
<view class="like-container">
<l-icon name="default" color="#666" size="28" />
<view class="number">10评论</view>
</view>
</view>
<l-tag shape="circle"
bg-color="#f3f3f3"
font-color="#3963BC"
slot="more"
size="large">
+ 关注
</l-tag>
</l-card>
js页面
// pages/mys/mys.js
Page({
/**
* 页面的初始数据
*/
data: {
text:[],
list:[],
page:1
},
/**
* 生命周期函数--监听页面加载
*/
onLoad: function (options) {
wx.request({
url: 'http://www.tp.com/admin/list',
data:{page:this.data.page},
method:"POST",
header:{
'token':wx.getStorageSync('token')
},
success :res=>{
console.log(res.data.data.data)
this.setData({
text:res.data.data.data,
page:this.data.page+1
})
}
})
},
onReachBottom: function () {
wx.request({
url: 'http://www.tp.com/admin/list',
data:{page:this.data.page},
method:"POST",
header:{'token':wx.getStorageSync('token')},
success:res=>{
console.log(res.data.data);
if(this.data.page<5){
this.setData({
list:this.data.list.concat(res.data.data),
page:this.data.page+1
})
console.log(this.data.list);
}
}
})
}
})
php代码
public function list(Request $request)
{
$page=$request->post('page');
$data=Price::paginate(5);
if($data){
return json(['code'=>'200','msg'=>'查询成功','data'=>$data]);
}else{
return json(['code'=>'400','msg'=>'查询失败','data'=>'']);
}
}
评论页面
<l-card type="avatar" l-class="card" image="{{text.image}}"
title="{{text.name}}" describe="18个小时前">
<!-- 此处为content -->
<view class="avter-content">
地址:{{text.city}}
爱好:{{text.u_name}}
</view>
<view class="avter-share-container">
<view class="like-container">
<l-icon name="default" color="#666" size="28" />
<view class="number">10评论</view>
</view>
</view>
<l-tag shape="circle"
bg-color="#f3f3f3"
font-color="#3963BC"
slot="more"
size="large">
+ 关注
</l-tag>
</l-card>
<view>评论功能</view>
<form bindsubmit="formAdd" >
<!-- <l-input label="评论" placeholder="请输入评论人" name="name" bind:lininput="name" /> -->
<l-input label="评论内容" placeholder="请输入评论" name="text" bind:lininput="text" />
<button type="default" form-type="submit">添加</button>
</form>
<l-card type="avatar" l-class="card" wx:for="{{ahao}}" image="https://gimg2.baidu.com/image_search/src=http%3A%2F%2Finews.gtimg.com%2Fnewsapp_bt%2F0%2F13926601261%2F641&refer=http%3A%2F%2Finews.gtimg.com&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=jpeg?sec=1632831780&t=d525af5d97621d669d549ea46b445e7e"
title="他他他" describe="两分钟前">
<!-- 此处为content -->
<view class="avter-content">
{{item.text}}
</view>
<view class="avter-share-container">
</view>
<l-tag shape="circle"
bg-color="#f3f3f3"
font-color="#3963BC"
slot="more"
size="large">
+ 关注
</l-tag>
</l-card>
js页面
// pages/mysfind/mysfind.js
Page({
/**
* 页面的初始数据
*/
data: {
comment:[],
text:[],
ahao:[]
},
/**
* 生命周期函数--监听页面加载
*/
onLoad: function (options) {
let id=options.id;
wx.request({
url: 'http://www.tp.com/admin/find?id='+id,
header:{
'token':wx.getStorageSync('token')
},
success :res=>{
console.log(res)
this.setData({
text:res.data.data
})
}
})
wx.request({
url: 'http://www.tp.com/admin/county_select',
header:{
'token':wx.getStorageSync('token')
},
method:"POST",
success :res=>{
console.log(res)
this.setData({
ahao:res.data.data
})
}
})
},
formAdd:function(e){
console.log(e.detail.value.name)
let name=e.detail.value.name
let text=e.detail.value.text
wx.request({
url: 'http://www.tp.com/admin/county_insert',
header:{
'token':wx.getStorageSync('token')
},
method:"POST",
data:{
name:name,
text:text
},
success:res=>{
let msg= res.data.msg
if(msg=="添加成功"){
this.setData({
show:1,
error:'1'
})
}
}
})
}
})
php代码
public function find(Request $request)
{
$id=$request->get('id');
$data=Price::find($id);
if($data){
return json(['code'=>'200','msg'=>'查询成功','data'=>$data]);
}else{
return json(['code'=>'400','msg'=>'查询失败','data'=>'']);
}
}
public function CountyInsert(Request $request)
{
$info=$request->post('');
$data=CommentFrom::create($info);
if($data){
return json(['code'=>'200','msg'=>'添加成功','data'=>$data]);
}else{
return json(['code'=>'400','msg'=>'添加失败','data'=>'']);
}
}
public function countySelect()
{
$data=CommentFrom::select();
if($data){
return json(['code'=>'200','msg'=>'查询成功','data'=>$data]);
}
}