weixin_46400038的博客

原创 uniapp 微信小程序的上传图片与预览图片

uni.chooseImage(OBJECT)从本地相册选择图片或使用相机拍照。success 返回参数说明参数 类型 说明tempFilePaths Array<String> 图片的本地文件路径列表tempFiles Array<Object>、Array<File> 图片的本地文件列表，每一项是一个 File 对象可以定义本地数组将获取成功的tempFilePaths 保存下来进行展示，浏览器限制不住图片的数量uni.previewImag.

原创 uni-app 发送请求，分页请求，触底加载

发送请求，保存数据 uni.request({ url: '接口?pageNo='+this.pageNo, method: 'GET', header: { 'content-type': 'application/json', }, data: { openId:this.openId, pageSize:3, }, success: function(res) { that..

原创 uni-app 数据绑定 v-model

将输入框的内容绑定到数组，并将输入框赋值为空

原创 uni-app 组件参数校验

props：{tring text：string 或者 text：Number 或者 text：[String ,Number]}

原创 uni-app 微信小程序登录流程详细过程

https://blog.csdn.net/abcwanglinyong/article/details/80267901doLogin:function(callback = () =>{}){let that = this;wx.login({ success:function(loginRes){ if(loginRes){ //获取用户信息 wx.getUserInfo({ withCredentials:true,//非必填 默认

原创 uni-app中使用Vuex

在 uni-app 项目根目录下新建 store 目录，在 store 目录下创建 index.js 定义状态值const store = new Vuex.Store({ state: { login: false, token: '', avatarUrl: '', userName: '' }, mutations: { login(state, provider)

原创 uniapp 显示置顶新闻

for(var i=0;res.data.result.records[i].isHomepage==1;i++) { this.articleList.push(res.data.result.records[i]); // this.articleList.push({ // articleTittle:res.data.result.records[i].articleTittle, // articleAuthor:res.data.re

原创 uniapp onload调用自定义方法

function getTopNewsList(that){ uni.request({ url: "http://39.100.50.21:8080/jeecg-boot/phil/article/queryListByHomePageIsTrue", success: (res) => { that.articleList = res.data.result; } }); }onLoad() { getTopNewsList(this); },

原创 uni-app条件渲染：v-if v-show

template中只能有一个viewv-if是删除 v-else 配套使用 ，不能是嵌套关系，必须是相邻的v-show 是隐藏//优先使用如果v-if为true，显示该组件

原创 uni-app 列表渲染: v-for

原创 uni-app 组件之间传值 参数

![在这里插入图片描述](https://img-blog.csdnimg.cn/20201111195735944.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80NjQwMDAzOA==,size_16,color_FFFFFF,定义父组件，子组件父组件中引入子组件，注册子组件，用子组件定义元素父组件给子组件传值..

原创 uni-app 实现虚拟弹窗

<text style="padding-left: 20rpx; color: #004261;" @click="clickDeleteDetail()" >删除</text>clickDeleteDetail() { uni.showModal({ title: '提示', content: '确定要删除吗？', confirmColor: '#12B368', success: function(res) { ...

原创 uni-app 页面跳转的方法

uni.navigateTo(OBJECT)保留当前页面，跳转到应用内的某个页面，使用uni.navigateBack可以返回到原页面。uni.redirectTo(OBJECT) 关闭当前页面，跳转到应用内的某个页面。uni.reLaunch(OBJECT)关闭所有页面，打开到应用内的某个页面。uni.switchTab(OBJECT) 跳转到 tabBar 页面，并关闭其他所有非 tabBar 页面uni.navigateBack(OBJECT) 关闭当前页面，返回..

原创 uni-app 页面显示hello world的方法

直接写在view中用插值表达式将data中的内容渲染在结构中{{text}}使用v-html绑定到view中使用v-text绑定到view中一、v-text用于渲染普通文本，无论何时，绑定的数据对象上 msg属性发生了改变，插值处的内容都会更新。{{message}}export default { data () { return { message: “这里可以包含html标签” } } }二、v-html如果你想输出真正的 HTML，你需要使用 v-html指令，v-text.

原创 uni-app 样式绑定

使用v-bind：綁定，也可以简写用：：class ：style绑定的内容来自data中

原创 uniapp onload中调用methods中函数不生效的解决办法

函数返回必须为箭头函数getTopNewsList(){ uni.request({ url: "http://39.100.50.21:8080/jeecg-boot/phil/article/queryListByHomePageIsTrue", success: (res) => { this.articleList = res.data.result; } }); },onLoad() { this.getTopNew

原创 uni-app background 使用本地图片

解释：css背景图片不能使用本地图片，官方给的理由是小程序不支持本地图片，只支持网络访问或者base64。所以uniapp也不支持，但是只要不超过40kb即可。 注意：把下面导入的图片路径改成你自己的。还有：如果图片大小超过40kb是不会自动转换的，需要程序员自己吧图片转换成base64格式<template> <view :style="{backgroundImage:`url(${indexBackgroundImage})`,backgroundSize: 'cov.

原创 uni-app 微信小程序 登录状态管理

uni-app全局变量实现方式：见文档。 方式多种多样，在这里我只对vuex和uni.setStorageSync进行说明。 方式一 ：vuex 1.在项目的根目录下创建文件‘store’，并在‘store’中新建index.js（名称随意起）如下： 说明：可...

原创 uniapp 两行显示，多余用省略号代替

如果要想显示两行，超出用省略号表示{ overflow: hidden; -webkit-line-clamp: 2; text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient: vertical;}-webkit-line-clamp用来限制在一个块元素显示的文本的行数。 为了实现该效果，它需要组合其他的WebKit属性。 常见结合属性：display: -webkit-box;