小程序 IView WeappUI组件库(简单增删改查)

IView Weapp 微信小程序UI组件库:https://weapp.iviewui.com/components/card

IView Weapp.png

快速上手搭建


快速上手.png

iView Weapp 的代码

将源代码下载下来,然后将dict放到自己的项目中去。


iView Weapp 的代码.png

小程序中添加iView Weapp

将dict文件家放入到小程序的项目中去。

demo如下所示


demo.png

新建一个目录list,然后在新建一个page.

在list.json中添加:

复制代码
{
  "usingComponents": {
    "i-card": "../../dist/card/index"
  }
  
}

list.wxml

复制代码
<!--miniprogram/pages/list/list.wxml-->

<i-card title="我超可爱" extra="啦啦啦啦啦" thumb="https://i.loli.net/2017/08/21/599a521472424.jpg">
    <view slot="content">
    
    内容不错
  
    </view>
    <view slot="footer">
    
    尾部内容
    
    </view>
</i-card>

效果截图如下所示:


image.png

简单书籍增删改查

后端接口


image.png

书籍列表

booklist.wxml


booklist.wxml

booklist.js


booklist.js

新增书籍

bookinsert.wxml


bookinsert.wxml

bookinsert.js


bookinsert.js

删除书籍


image.png

修改书籍

bookupdate.wxml


bookupdate.wxml

bookupdate.js


bookupdate.js

初次尝试,写的不好请多多指教,有需要源码项目的,请私信我哦
最后编辑于:2025-04-21 11:07:15
© 著作权归作者所有,转载或内容合作请联系作者

喜欢的朋友记得点赞、收藏、关注哦!!!

相关推荐
月亮不月亮几秒前
月亮商场购物打折Java
java·eclipse
moxiaoran57533 分钟前
Springboot+MongoDB简单使用示例
spring boot·mongodb·spring
guozhetao10 分钟前
【ST表、倍增】P7167 [eJOI 2020] Fountain (Day1)
java·c++·python·算法·leetcode·深度优先·图论
技术思考者11 分钟前
基础很薄弱如何规划考研
java·经验分享·考研
江城开朗的豌豆21 分钟前
Vue和React中的key:为什么列表渲染必须加这玩意儿?
前端·vue.js·面试
江城开朗的豌豆27 分钟前
前端路由傻傻分不清?route和router的区别,看完这篇别再搞混了!
前端·javascript·vue.js
iVictor33 分钟前
分享一个 MySQL binlog 分析小工具
mysql
●VON34 分钟前
重生之我在暑假学习微服务第二天《MybatisPlus-下篇》
java·学习·微服务·架构·mybatis-plus
老华带你飞34 分钟前
口腔助手|口腔挂号预约小程序|基于微信小程序的口腔门诊预约系统的设计与实现(源码+数据库+文档)
java·数据库·微信小程序·小程序·论文·毕设·口腔小程序
小鱼人爱编程39 分钟前
Java基石--反射让你直捣黄龙
前端·spring boot·后端