当前位置: 首页 > news >正文

微信小程序留言板1

wxml:

<view class="view2">
<text class="test1">留言:</text><input type="text" class="input1" bindinput="ipt"/><button class="btn" bindtap="btn">点击留言</button>
</view>
<!-- 打印出来的值 -->
<!-- {{num}} -->
<view class="view1" wx:for="{{arr}}" wx:key="*this">
{{item}}
<!-- <text class="test3" bindtap="del" data-index="{{index}}">X</text> -->
<text class="test3" bindtap='del' data-index="{{index}}">删除</text>
</view>

wxjs:

// pages/stext/stext.js
Page({/*** 页面的初始数据*/data: {arr:[11,22,33],num:'',index:''},ipt(e){this.setData({num:e.detail.value})},// 点击留言btn(){let newarr = this.data.arr;newarr.push(this.data.num)this.setData({arr:newarr})},// 删除// del(e){//   console.log(e);//   let index = e.target.dtaset//   this.data.arr.splice(index,1)//   this.setData({//     arr:this.data.arr//   })// },del(e){   wx.showModal({title: '提示',content: '确认要删除该支出类型?',complete:(res) => {if (res.confirm) {let index = e.currentTarget.dataset.indexlet list=this.data.arrlist.splice(index,1)console.log(list);this.setData({arr:list})}}})},/*** 生命周期函数--监听页面加载*/onLoad(options) {},/*** 生命周期函数--监听页面初次渲染完成*/onReady() {},/*** 生命周期函数--监听页面显示*/onShow() {},/*** 生命周期函数--监听页面隐藏*/onHide() {},/*** 生命周期函数--监听页面卸载*/onUnload() {},/*** 页面相关事件处理函数--监听用户下拉动作*/onPullDownRefresh() {},/*** 页面上拉触底事件的处理函数*/onReachBottom() {},/*** 用户点击右上角分享*/onShareAppMessage() {}
})

wxss:

.test1{float: left;line-height: 50px;
}
.input1{float: left;border: 1px solid #ccc;height: 42px;
}
.btn{width: 100px;background: pink;
}
.view2{margin-bottom: 50px;
}
.view1{margin-left: 35px;
}
.test3{position: fixed;left: 320px;
}

相关文章:

  • 【Spring Boot】统一数据返回
  • vue2+element-ui新增编辑表格+删除行
  • Linux系统常用Conda命令(不断更新!)
  • Vue 性能革命:揭秘前端优化的终极技巧;Vue优化技巧,解决Vue项目卡顿问题
  • 研0学习Python基础4
  • gda动态调试-cnblog
  • js【最佳实践】遍历数组的八种方法(含数组遍历 API 的对比)for,forEach,for of,map,filter,reduce,every,some
  • 如何查看MCU编译生成的elf(out)文件内容
  • 001 SpringMVC介绍
  • Go语言标准库之log和三方库zap
  • 【基础篇】第5章 Elasticsearch 数据聚合与分析
  • 六西格玛绿带培训如何告别“走过场”?落地生根
  • ‘艾’公益——微笑行动「广安站」为艾祝福,让笑起舞
  • 华为OD面试分享18
  • 【C++航海王:追寻罗杰的编程之路】关联式容器的底层结构——AVL树
  • 实现windows 窗体的自己画,网上摘抄的,学习了
  • 【node学习】协程
  • 11111111
  • crontab执行失败的多种原因
  • el-input获取焦点 input输入框为空时高亮 el-input值非法时
  • GraphQL学习过程应该是这样的
  • JavaScript 事件——“事件类型”中“HTML5事件”的注意要点
  • Js基础知识(一) - 变量
  • Linux编程学习笔记 | Linux IO学习[1] - 文件IO
  • Mac 鼠须管 Rime 输入法 安装五笔输入法 教程
  • maya建模与骨骼动画快速实现人工鱼
  • nodejs调试方法
  • Spring框架之我见(三)——IOC、AOP
  • VirtualBox 安装过程中出现 Running VMs found 错误的解决过程
  • vue+element后台管理系统,从后端获取路由表,并正常渲染
  • 半理解系列--Promise的进化史
  • 使用Swoole加速Laravel(正式环境中)
  • 试着探索高并发下的系统架构面貌
  • CMake 入门1/5:基于阿里云 ECS搭建体验环境
  • ​Linux Ubuntu环境下使用docker构建spark运行环境(超级详细)
  • ​软考-高级-系统架构设计师教程(清华第2版)【第12章 信息系统架构设计理论与实践(P420~465)-思维导图】​
  • $ is not function   和JQUERY 命名 冲突的解说 Jquer问题 (
  • %@ page import=%的用法
  • (4)STL算法之比较
  • (PHP)设置修改 Apache 文件根目录 (Document Root)(转帖)
  • (poj1.3.2)1791(构造法模拟)
  • (定时器/计数器)中断系统(详解与使用)
  • (二)hibernate配置管理
  • (附源码)spring boot网络空间安全实验教学示范中心网站 毕业设计 111454
  • (三) prometheus + grafana + alertmanager 配置Redis监控
  • (算法)求1到1亿间的质数或素数
  • .NET 中使用 TaskCompletionSource 作为线程同步互斥或异步操作的事件
  • .NET/C# 使窗口永不激活(No Activate 永不获得焦点)
  • .net最好用的JSON类Newtonsoft.Json获取多级数据SelectToken
  • @RequestBody详解:用于获取请求体中的Json格式参数
  • @RestController注解的使用
  • @SpringBootApplication 包含的三个注解及其含义
  • @SuppressLint(NewApi)和@TargetApi()的区别
  • @Transactional类内部访问失效原因详解
  • [ vulhub漏洞复现篇 ] JBOSS AS 5.x/6.x反序列化远程代码执行漏洞CVE-2017-12149