- 博客(24)
- 收藏
- 关注
原创 VUE的项目中怎样修改浏览器窗口的 LOGO
vue项目如何修改上图浏览器的标题栏的图标在public目录中的index.html添加如下代码 <link rel="icon" href="<%= BASE_URL %>logo.svg">注意logo.svg是图片。图片位置在public目录下
2022-05-30 23:57:24 1131
原创 用纯css实现三角形
<template> <view> <view> 用纯css实现三角形 <view class="box"></view> </view> </view></template><script> export default { data() { return { } }, methods: { } }</scrip
2022-05-24 12:50:08 222
原创 使用flex实现元素水平垂直居中
<template> <view> <view class="father"> <view class="son"></view> </view> </view></template><script> export default { data() { return { } }, methods: { } }</scri
2022-05-24 12:35:15 915
原创 去掉数组中的重复数据
//去掉数组中的重复数据removeRepeat(){ //1.创建一个新数组,把原数组第一个元素插入新数组 //2.遍历原数组中每个元素分别和新数组中每个元素比较 var oldArr = [1,2,4,1,2,6,3,6,55,33,99,55,6]; var newArr = []; newArr[0] = oldArr[0]; //遍历原数组 for(var i = 0; i<oldArr.length; i++){ //新数组 for(var j = 0;...
2022-05-16 20:17:02 1121
原创 冒泡排序和反转数组
bubbling(){ //冒泡排序,将数组【5 4 3 2 1】由小到大排序 var arr =[5,4,3,2,1]; //比较的轮数 for(var i=0; i<arr.length-1; i++){ //每轮比较次数 for(var j=0; j<arr.length-1-i; j++){ //判断前一个数比后一个数大 if(arr[j]>arr[j+1]){ var temp = arr[j]; arr[j]=arr[j+1];
2022-05-16 19:28:50 98
原创 封装函数将字符串进行驼峰命名法
<script> export default { data() { return { } }, onLoad() { var test = this.toString('get-element-by-id-at'); console.log(test); }, methods: { //将字符串“get-element-by-id”转换为getElementById //自定义函数 toString(str) {
2022-05-16 19:03:05 170
原创 uniapp,组件间传值
父组件向子组件传值在父组件添加要传数据,子组件通过props接收数据父组件代码:<template> <view> <test :number="number"></test> </view></template><script> import test from '@/components/test.vue' export default { data() { return { n
2022-04-16 17:56:53 3534
原创 uniapp中组件生命周期
组件支持的生命周期,与vue标准组件的生命周期相同。这里没有页面级的onLoad等生命周期父组件代码<template> <view> 接收上一个页面的参数id{{id}}和age{{age}} <test v-if="flag"></test> <button type="primary" @click="change">test组件切换</button> </view></template&g
2022-04-16 16:42:29 2833
原创 uniapp,上一个页面向下一个页面传参
上一个页面跳转到下一个页面需要携带参数时,可以在跳转路径后+?+参数名+ = +参数值,如有多个参数用&连接如从index页面跳转到详情页需要传id 和age两个参数detail/detail?id=80&age=20当前页面代码如下<navigator url="../detail/detail?id=80&age=20">跳转下一页面,并传参id和age</navigator>下一个页面在onLoad生命周期options接收参数下一页面代码
2022-04-16 16:06:11 749
原创 uniapp,图片上传和图片预览
效果如图直接看代码<template> <view> <button type="primary" @click="chooseImage">上传图片</button> <view class="imgBox" v-for="(item,index) in imgArr" :key="index"> <image :src="item" @click="previewImage(index)"></imag
2022-04-16 15:16:54 518
原创 uniapp数据存储在本地,获取和移除。
uniapp数据存储在本地,获取和移除,两种方法,异步和同步,推荐使用同步html代码<template> <view> <button type="default" @click="setStorage">数据缓存到本地</button> <button type="primary" @click="getStorage">获取数据</button> <button type="warn" @click="re
2022-04-16 12:07:23 14345
原创 uniapp修改H5页面浏览器标签栏小图标
uniapp如何修改上图浏览器的标题栏的图标。找到根目录的index.html文件,然后在head标签离添加以下两行代码<link rel="stylesheet" href="<%= BASE_URL %>static/index.<%= VUE_APP_INDEX_CSS_HASH %>.css" />//必须的,要不然不生效<link rel="icon" href="./static/logo1.png"/>//图标的路径效果图如下:.
2022-04-15 11:48:31 3165 2
原创 uniapp编译为微信小程序报错‘forceUpdate’ of undefined
微信小程序报错:Cannot read property ‘forceUpdate’ of undefined报错截图报错原因:没有配置小程序appId。解决方法:在manifest.json文件中的微信小程序配置添加微信小程序AppID
2022-04-15 09:32:33 769
原创 git代码拉取,推送
git代码拉取,推送克隆代码git clone git@gitee.com:*/.git(项目地址)1)更新本地add git add .2)备注信息 git commit -m ‘备注内容’3)拉取代码 git pull origin develop(注意,如果出现合并窗口,同时按下shift+:,输入wq,然后回车)(文件冲突输入命令: git status)4)推送代码 git push origin developpc端代码编译 npm run build查看电脑IP命令 ipc
2022-04-14 11:06:16 364
原创 Git下载项目并运行
GitHub下载项目并运行打开你想要存储的该项目的位置(如E:\Project),鼠标右键,点击Git Bash Hear,弹出Git命令窗口,输入git clone 你复制的项目地址,然后回车下载下来的项目,需要进入这个项目文件夹,然后右键->Git Bash Here,安装依赖环境 :npm install...
2022-04-14 11:01:15 2214 1
原创 前端开发环境搭建
前端开发环境搭建1)下载安装node安装地址流程https://www.runoob.com/nodejs/nodejs-install-setup.htmlnode安装模式选择默认的环境搭建链接https://www.csdn.net/gather_2b/OtTaMgzsNzA1LWJsb2cO0O0O.html(vue.js安装步骤使用Node.js安装)这链接安装cnpm命令有误,正确的是npm install -g cnpm --registry=https://registry.np
2022-04-14 10:59:04 1231
原创 uniapp页面生命周期
uni-app 支持 onLoad、onShow、onReady 等生命周期函数onInit 监听页面初始化,其参数同 onLoad 参数,触发时机早于 onLoadonLoad 监听页面加载,其参数为上个页面传递的数据,参数类型为 Object(用于页面传参)//在起始页面跳转到test.vue页面并传递参数uni.navigateTo({ url: 'test?id=1&name=uniapp'});// 在test.vue页面接受参数export default { onL
2022-04-14 10:55:45 2732 1
原创 uniapp,应用生命周期
uniapp,应用生命周期uni-app 支持 onLaunch、onShow、onHide 等应用生命周期函数onLaunch 初始化完成时触发(全局只触发一次)在onlaunch生命周期内进行页面的跳转,需要注意:可能会和pages.json内配置的第一个页面跳转时机冲突。造成的错误是手机端页面白屏,控制台报错:11:47:40.766 Mon May 20 2019 11:47:45 GMT+0800 (CST) Page route 错误(system error) 11:47:40.
2022-04-14 10:46:16 662
原创 uniapp,pages.json文件中tabBar
uniapp,pages.json文件中tabBar在 pages.json 中提供 tabBar 配置,和pages,globalStyle同级tabBar 中的 list 是一个数组,只能配置最少2个、最多5个 tab,tab 按数组的顺序排序当设置 position 为 top 时,将不会显示 icon"tabBar": { "color": "#999999",//tab 上的文字默认颜色 "selectedColor": "#9846FF",//tab 上的文字选中时的颜色 "
2022-04-14 10:26:47 2557 1
原创 uniapp项目引入element
uniapp项目引入element命令 npm i element-ui -Smain.js添加import Vue from ‘vue’import App from ‘./App’// 使用elementimport ElementUI from ‘element-ui’import ‘element-ui/lib/theme-chalk/index.css’;Vue.config.productionTip = falseApp.mpType = ‘app’// 使用element
2022-04-13 14:05:24 1608 5
原创 uniapp 发起网络请求
uniapp 发起网络请求// 发起网络请求 uni.request({ url: url,//开发者服务器接口地址 method: method || "GET", header: header,//设置请求的 header,header 中不能设置 Referer。 data: data,//请求的参数 dataType: "json", sslVerify: false, // 是否验证ssl证书 success: res => { uni
2022-04-13 13:33:51 1812
原创 uni-app 中pages.json pages
uni-app 通过 pages 配置应用由哪些页面组成,pages 节点接收一个数组,数组每个项都是一个对象pages节点的第一项为应用入口页(即首页)开发目录┌─pages│ ├─index│ │ └─index.vue│ └─login│ └─login.vue├─static├─main.js├─App.vue├─manifest.json└─pages.json//pages.json 文件对应代码{ "pages": [ {
2022-04-13 12:44:14 408
原创 uniapp,pages.json文件中globalStyle
uniapp,pages.json文件中globalStylepages.json 文件用来对 uni-app 进行全局配置,决定页面文件的路径、窗口样式、原生的导航栏、底部的原生tabbar 等。globalStyle用于设置应用的状态栏、导航条、标题、窗口背景色等{ "pages": [ //pages数组中第一项表示应用启动页,参考:https://uniapp.dcloud.io/collocation/pages { "path": "pages/index/index"
2022-04-13 12:26:23 662
原创 uniapp中使用uview UI的组件Sticky 吸顶 在H5下报错‘bottom‘ of null。纯css实现吸顶功能。
项目场景:提示:这里简述项目相关背景:uniapp中使用uview UI的组件Sticky 吸顶 在H5下报错’bottom’ of null。纯css实现吸顶功能。问题描述在uniapp中使用uview UI的组件Sticky在H5下报错’bottom’ of null。网上查找了很多,都说产生的原因是:吸顶组件u-sticky和底部导航栏tabbar切换页面时产生冲突原因分析:原因是切换页面,页面的sticky的Observer监听没有销毁,所以需要在onHide中将sticky的属性en
2022-04-13 11:57:55 2647 1
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人