第一、如何获取input框的值(form表单提交除外)

   bindinput事件

<input type='text'
placeholder="请输入内容"
placeholder-style='padding-left:10px'
bindinput='bindinput'
value='{{insertTest}}'
/>
/**
* 获取input值
*/
bindinput:function(e){
this.setData({
insertTest: e.detail.value,
});
},

第二、添加数据到数组

  先存到data的数组中,
  然后定义一个变量储存,
  最后setData

 /*
* add
* 添加的方法
*/
add:function(e){
this.data.testList.unshift(this.data.insertTest);// push(),添加到数组之后,unshift(),添加到数组之前
let list = this.data.testList;
this.setData({
testList:list,
insertTest:''
})
},

第三、删除点击对应的数据

 /**
* delData 删除点击的数据
*/
delData:function(e){
this.data.testList.splice(e.currentTarget.dataset.index,1); // 数组的splice方法
var list = this.data.testList;
this.setData({
testList:list,
});
},

结果:

样式有点难看,只是自己的一个demo。

代码地址:https://github.com/suncpp/myResources

 

微信小程序入门---记事本增---删的更多相关文章

  1. 天河微信小程序入门《四》:融会贯通,form表单提交数据库

    天河在阔别了十几天之后终于又回来了.其实这篇文章里的demo是接着(天河微信小程序入门<三>)后面就做了的,但是因为最近在做别的项目,所以就偷懒没有发出来.放到今天来看,从前台提交数据到数 ...

  2. 天河微信小程序入门《三》:打通任督二脉,前后台互通

    原文链接:http://www.wxapp-union.com/forum.php?mod=viewthread&tid=505&extra=page%3D1 天河君在申请到https ...

  3. 天河微信小程序入门:阿里云tomcat免费配置https

    天河君在第一时间通过了微信小程序验证,开启了我的微信小程序之旅.因为天河君之前是一名后端狗,对前端不是很了解,所以几乎可以认为是从零开始学做微信小程序.也希望有志在微信小程序方向做点事情的朋友能够和我 ...

  4. 我的微信小程序入门踩坑之旅

    前言 更好的阅读体验请:我的微信小程序入门踩坑之旅 小程序出来也有一段日子了,刚出来时也留意了一下.不过赶上生病,加上公司里也有别的事,主要是自己犯懒,就一直没做.这星期一,赶紧趁着这股热乎劲,也不是 ...

  5. 微信小程序入门正确姿势(一)

    [未经作者本人同意,请勿以任何形式转载] >>>前言 这是 [认真学编程] 系列的 第4篇 文章(微信小程序入门系列),欢迎点赞分享.写留言,这些都是对我最好的支持. 本系列适合有一 ...

  6. 微信小程序入门篇

    微信小程序入门篇: 准备工作 IDE搭建 就不多说了,没有内测码去下载个破解版吧,我用了一下,学习完全够了!IDE破解版+安装教程 图片发自简书App 知识准备 JavaScrip还是要看看的,推荐教 ...

  7. 微信小程序入门案例

    本文通过具体的实例记录微信小程序的入门知识. 1.特点 不需要安装 依赖微信应用 更接近原生APP 丰富的框架及API可达到快速开发的目的 2.工具使用 在开发的过程中可以使用微信开发者工具,更加直观 ...

  8. 从零开始的微信小程序入门教程(一)

    之前说要和同事一起开发个微信小程序项目,现在也在界面设计,功能定位等需求上开始实施了.所以在还未正式写项目前,打算在空闲时间学习下小程序.本意是在学习过程中结合实践整理出一个较为入门且不是很厚的教程, ...

  9. 微信小程序入门与实战 常用组件API开发技巧项目实战*全

    第1章 什么是微信小程序? 第2章 小程序环境搭建与开发工具介绍 第3章 从一个简单的“欢迎“页面开始小程序之旅 第4章 第二个页面:新闻阅读列表 第5章 小程序的模板化与模块化 第6章 构建新闻详情 ...

随机推荐

  1. 【SpringBoot】整合日志框架

    一.日志框架概述 1.1 日志框架的产生 1.2 市面上的日志框架 二.SLF4j 使用与整合 2.1 如何在系统中使用SLF4j 2.2 如何整合日志框架 2.3 SpringBoot中的日志关系 ...

  2. Google C++单元测试框架GoogleTest---AdvancedGuide(译文)

    上篇在这里: 下篇在这里.

  3. linux物理地址和虚拟地址

  4. JAVA中AES对称加密和解密以及与Python兼容

    引言:本文主要解决Java中用AES加密及解密,同时可通过Python脚本对Java加密后的字符进行解密的操作. 由于近期工作中用到需要使用Java对一串密钥进行加密,并且后台通过Python语言读取 ...

  5. 3.Bacula Client安装配置

    1.   Bacula Client安装配置 1.1.   linux客户端安装 1.1.1.  安装依赖包 yum install libacl libacl-devel 1.1.2.  Clien ...

  6. Redis使用总结-基础篇

    年底的时候开始尝试在重构的项目中使用redis,现在项目稳定运行也有一段时间了,这里做一下阶段性总结. 一.简介 首先,redis是什么意思呢,官方文档的FAQ里给出了答案:It means REmo ...

  7. meta 中的属性viewport

    粘贴自:https://blog.csdn.net/u012402190/article/details/70172371 <meta name="viewport" con ...

  8. IIS配置web.config 将带www域名转为不带www域名

    在configuration节点中添加 <configuration> <system.webServer> <rewrite> <rules> < ...

  9. Web自动化简介

    在迭代中时,先写出粗略的自动化测试用例,不是非常精准的一些提示,等到项目上线后,提示文案已经确定,再完善用例,使之成为一个完整的自动化测试工程. 用excel管理测试数据,读取效率比较低,需要读取.数 ...

  10. IntelliJ IDEA 运行项目的时候提示 Command line is too long 错误

    在 IntelliJ IDEA 项目运行的时候收到了下面的错误提示: Error running 'Application': Command line is too long. Shorten co ...