pages/upVideo.wxml
//获取用户的头像和昵称展示
<view class="headerBox">
<image src="{
{userInfo.weixinInfo.avatarUrl}}"></image>
<text>{
{
userInfo.weixinInfo.nickName}}</text>
</view>
//填写动态相关的信息,select为自定义的下拉选择组件
<view class="classifyBox">
<input type="text" placeholder="课程标题(20个字以内)" value="{
{title}}" maxlength="20" bindblur="titleBlur" bindinput="getInput"></input>
<input type="digit" placeholder="课程价格" value="{
{price}}" bindblur="priceBlur" bindinput="getPrice"></input>
<select prop-array='{
{selectList}}' selectText="选择课程分类" selectShow="{
{select}}" bind:m_select_touch="m_select_touch"></select>
</view>
<view class="desc">
<textarea focus="true" placeholder="课程简介" value="{
{desc}}" maxlength="-1" placeholder-style="font-size:14px;color:#666" bindblur="descBlur" bindinput="getTextarea" />
</view>
<!-- 敏感内容警告提示节点 -->
<van-notify id="van-notify" />
<view class="imageRootAll">
<van-uploader
file-list="{
{ fileList }}"
accept="{
{accept}}"
multiple="true"
compressed="false"
bind:delete="Delete"
bind:after-read="afterRead"
/>
</view>
<button type="primary" bindtap="publish">确认上传</button>
pages/upVideo.wxss
/* 头部信息 */
.headerBox{
height:80px;
width:100%;
background:#fff;
display: flex;
align-items: center;
}
.headerBox image{
height: 60px;
width:60px;
border-radius: 50%;
margin:0px 20px;
}
.headerBox text{
font-size:18px;
color:#999;
}
/* 标题和分类 */
.classifyBox{
width: 100%;
height: 110px;
/* margin:0px 2%; */
background: #fff;
border-top:1px solid #b1b1b1;
}
.classifyBox input{
height: 30px;
width: 90%;
margin:5px 5%;
font-size: 14px;
border-bottom:1px solid #b1b1b1;
}
/* 详细内容 */
.desc{
width:100%;
height:200px;
background:#fff;
}
.desc textarea{
width:90%;
margin:10px 5%;
height:100%;
}
.imageRootAll{
background:#fff;
width:100%;
}
.imageRootAll van-uploader{
width:98%;
margin:1%;
background:#fff;
}
button{
margin:30px 10%;
width:80%;
height: 40px;
}
.showChoose{
height: 200px;
width:200px;
margin-left:5%;
background:#cdcdcd;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
}
.showChoose image{
width:60px;
height:60px;
}
.showChoose view{
color:#efefef;
}
/* 弹出层 */
van-popup{
height: 100%;
width:100%;
}
van-popup view{
height: 20%;
width:100%;
text-align: center;
/* line-height: 30%; */
}
van-popup .chooseImg{
margin-top:2%;
}
pages/upVideo.json 。用到的vant 组件都是统一在全局app.json中引入的,这里就没必要重复引入了
{
"usingComponents": {
"select": "/components/select/select"
}
}
到官网中下载,然后引入就可以,主要是引入路径的修改。
pages/upVideo.js。图片上传和视频上传其实都是差不多的,定义一个临时存储的数组,然后对数组进行遍历,上传到云存储,保存云存储的存储路径保存到云数据库,改一下返回的一些参数就可以了。
const app=getApp();
const {
days,TurnSecondPoints}=require('../../utils/getNowFormatDate.js');
const {
hasSensitiveWords}=