- 博客(63)
- 收藏
- 关注
RSS订阅原创 二、tabBar操作
1.创建分支git checkout -b tabbar 创建tabbar分支 git branch 查看当前所在的分支2.创建四个页面 创建页面仿照home.vue页面操作，创建其余的分类页面（cate.vue）、购物车页（shop.vue）和我的页面（my.vue）准备静态资源文件把tabbar需要的图片放在static文件夹中修改pages.json在Hbuilderx打开的项目的pages.json中配置如下：{ "pages": [ .
2022-02-21 11:00:11
912
原创 一、项目环境搭建
1.uniapp简介uni-app 是一个使用 Vue.js 开发所有前端应用的框架，开发者编写一套代码，可发布到iOS、Android、Web（响应式）、以及各种小程序（微信/支付宝/百度/头条/飞书/QQ/快手/钉钉/淘宝）、快应用等多个平台。2.HbuilderX3.创建项目（1）创建项目打开HbuilderX编辑器，操作如下，创建一个uniapp项目。创建好的项目目录如下：（2）配置manifest.json （3）配置运行配置打开Hbuild
2022-02-21 10:24:54
583
原创 vue博客发布案例
<div id="app"> <textarea name="" id="" cols="30" rows="10" v-model="content"></textarea> <button @click="showContent">发布</button> <ul> <li v-for="(item,index) in infoList"> &...
2022-02-15 15:16:14
304
原创 小程序生命周期函数、组件
一、生命周期函数二、组件小程序中比如出现多个页面的tab选项卡效果、轮博图效果或者星星评分等，我们一般不是每个页面都实现这个功能，一般是把重复的功能或者模块封装成组件，哪个页面使用就导入即可。1.创建组件在项目的根目录下面新建components文件夹（和pages目录平级），里面再新建每个组件。2.全局引用组件在app.json中定义如下：{ "pages":[ 。。。。 ], "usingComponents": { "my-test".
2022-01-21 10:24:40
1439
原创 小程序数据请求、页面跳转和下拉触底
一、数据请求1.接口设置处于安全性的考虑，小程序官方要求小程序请求的接口必须满足下面两个条件：只能请求https的接口 必须把接口的域名添加到信任列表中(1)开发者工具配置第一种方式：测试的时候用第二种方式：真正使用的时候用把你的服务端的域名在小程序管理后台配置，添加合法性，就可以正常访问。登录小程序后台，把你的域名配置进去小程序后台配置成功以后，微信开发者工具的设置-详情里面就能看到你配置的服务器的信息了，以后你再访问此网站下面的内容就可以自由访问了。
2022-01-21 10:12:02
1383
原创 小程序常用视图标签、样式和全局配置
一、常用视图标签1.viewview标签前面一直在用，不做赘述，相当于我们以前学习的div，是块元素，一般搭配我们学过的伸缩布局来实现。2.scroll-view此视图标签一般用于移动端常见的滚动效果。wxml中标签设置如下：<scroll-view class="scroll-box" scroll-y> <view>导航1</view> <view>导航2</view> <view>导航3<
2022-01-14 11:11:10
768
原创 小程序介绍和基本操作
一、简介微信小程序是张小龙所带领的腾讯广州研发中心产品团队打造，2017年才发布。微信小程序特点：无需安装和卸载 制作成本低 内存小、运行快,操作便利快捷 容易部署,具有丰富的延展性大家可以打开微信搜索小程序比如：惠友到家、美团等等，使用方便快捷。二、项目目录介绍三、基本操作1.数据绑定比如新建页面test文件夹,鼠标右键新建page自动生成四个文件在test.js中定义数据data: { name:'tom', pic:'/imag
2022-01-14 10:48:25
672
原创 action、gitter
一、action1.action初步使用因为mutations中是不能写异步的代码的，比如setTimeOut()等比如我们需要数据隔几秒再发生变化，这种异步的代码我们只能写在action中。我们在store/index.js中实现代码如下：import Vue from "vue";import Vuex from "vuex";Vue.use(Vuex);export default new Vuex.Store({ state: { num: 0 },
2022-01-04 08:57:57
220
原创 vuex基础语法、state代码示例、mutations代码示例
一、vuex基础语法1.简介Vuex 是一个专为 Vue.js 应用程序开发的状态(数据)管理模式。简单来说就是方便管理管理组件之间的数据共享，原来我们那种父传子、子传父、兄弟组件传值的方式在小型项目中还能应付过来，如果是项目比较复杂，还是建议使用vuex使用数据共享。2.基础使用步骤vuex的使用步骤如下：1.安装vuexnpm install vuex --save2.导入vueximport Vuex from 'vuex'Vue.use(Vuex)3
2022-01-04 08:52:12
667
原创 三、创建组件
1.创建组件模板每一个vue的单页面组件都是由三部分组成：template代表结构，也就是相当于我们以前学的html script相当于我们以前学的js style相当于我们以前学的css比如我们在views下面新建News.vue页面（一般文件的名字是首字母大写），我们如果手动去写基本结构比较麻烦，建议用下面的配置vscode中的file-preferences-user snippets,然后输入vue，输入模板如下：{ "Print to console": { "
2021-12-15 15:02:58
1142
原创 二、Element-UI
1.简介Element，一套为开发者、设计师和产品经理准备的基于 Vue 2.0 的桌面端组件库2.使用步骤1.命令行方式创建我们打开我们前面用命令行创建的my-project项目，在命令行执行下面的命令npm install element-ui -S src/main.js导入element-ui,代码如下：// 导入element-uiimport ElementUI from "element-ui";// 导入elemet-ui中的样式文件import ..
2021-12-15 14:58:32
1240
原创 vue脚手架
一、vue脚手架1.简介Vue CLI 是一个基于 Vue.js 进行快速开发的完整系统。2.命令行操作步骤npm install -g @vue/cli 安装3.x版本的vue脚手架 vue -V 测试是否安装成功 vue create 项目名 （注意不要用中文和特殊字符） cd 项目名 npm run serve从vue create my-project为例展示截图最后cd到你自己创建的项目中，npm run serve把项目跑起来即...
2021-12-15 14:38:33
28040
原创 webpack打包
一、webpack1.简介webpack官网webpack是一个流行的前端项目构建工具（打包工具），因为我们目前web开发会有下面几个问题：文件之间互相依赖关系复杂 浏览器对于Es6的模块化支持不是很友好 浏览器对于js的新语法特性兼容性也不是很好webpack可以解决上述问题。2.npm补充两者都会安装到项目文件夹下的node_modules文件夹下npm install xx -D 即写入devDependencies对象（里面的插件只用于开发环境，不用于生产环境）
2021-12-10 08:54:27
1233
原创 fetch、axios
一、fetchfetch也是一种新的请求后台接口的方式，语法如下：fetch(url) .then(fn1) .then(fn2) .catch(fn3) ....代码示例：<script> fetch("http://127.0.0.1:3000/list") .then(function(data) { return data.text(); }) .then(
2021-12-08 11:07:09
552
原创 promise
一、接口调用方式我们都知道一般我们前台获取的数据都是从后台获取的，我们一般采用下面几种方式调取后台接口数据：原生js的AJAX jquery封装的AJAX(偏向于操作DOM,不适用于vue) fetch axios二、promise1.promise简介1.创建后端接口我们先用node创建本地服务,代码如下：npm init -y npm install [email protected] npm install cors 创建服务,代码如下：const expres
2021-12-04 16:22:22
75
原创 vue组件
一、组件化1.简介组件（component）是vue.js最强大的功能之一。组件的作用就是封装可重用的代码，通常一个组件就是一个功能体，便于在多个地方都能够调用这个功能体。 每个组件都是Vue的实例对象。 我们实例化的Vue对象就是一个组件，而且是所有组件的根组件2.全局注册组件<body> <div id="app"> <my-header></my-header> <my-header>&l
2021-12-03 14:40:40
1391
原创 git入门
Git 版本管理系统发展史Linux 内核开源项目有着为数众多的参与者。 绝大多数的 Linux 内核维护工作都花在了提交补丁和保存归档的繁琐事务上（1991－2002年间）。 到 2002 年，整个项目组开始启用一个专有的分布式版本控制系统 BitKeeper 来管理和维护代码。到了 2005 年，开发 BitKeeper 的商业公司同 Linux 内核开源社区的合作关系结束，他们收回了 Linux 内核社区收费使用 BitKeeper 的权力。 这就迫使 Linux 开源社区（特别是 Lin
2021-12-01 14:57:52
1068
原创 vue基础语法
一、表单操作1.表单绑定语法 <script src="vue.js"></script> </head> <body> <div id="app"> <form action=""> 姓名 <input type="text" v-model="name" /> 性别 <input type="radio" v-model="
2021-12-01 14:50:16
590
原创 vue基础指令2
五、属性绑定语法： v-bind:属性名=值 或者:属性名=值 <div id="app"> <a :href="url">跳转</a> <button @click="fn">更改跳转地址</button> </div> <script> var vue = new Vue({ el: "#app", data: {
2021-12-01 14:44:22
316
原创 vue基础指令1
一、vue简介vue的优势：轻量级框架、简单易学、双向数据绑定、组件化、数据和结构的分离、虚拟DOM、运行速度快。vue是单页面应用，使页面局部刷新，不用每次跳转页面都要请求所有数据和dom，这样大大加快了访问速度和提升用户体验。而且他的第三方ui库很多节省开发时间。二、vue初识1.传统做法传统做法是通过获取DOM元素并且动态赋值的方法,代码示例如下： <body> <div id="box"></div> <scri
2021-11-27 17:46:36
476
原创 node连库、跨域和解决、身份认证
一、node连库1.查询功能const mysql = require("mysql");const db = mysql.createPool({ host: "localhost", user: "root", password: "root", database: "test"});console.log(db);db.query("select * from users", (err, results) => { if (err) { return
2021-11-25 19:41:30
666
原创 express、路由、中间件
一、express1.简介Express 是一个保持最小规模的灵活的 Node.js Web 应用程序开发框架，为 Web 和移动应用程序提供一组强大的功能。 我们前面使用http模块能创建web服务器，express也能搭建web服务器，因为express是基于内置的http模块进一步封装起来的，使用起来会更简单和灵活。http和express的关系相当于js和jquery的关系。2.基础使用npm install express@版本号建议设置好版本号，避免出问题co.
2021-11-25 17:45:34
294
原创 Node.js基础知识
一、NodeJS简介2. NodeJs初识我们常用的后端语言主要是php、java、python等，那么js是否可以做后端开发呢？是可以的，但是前提是js代码必须在NodeJs的环境中才可以。NodeJs是基于Chrome V8引擎的javascript运行环境。总结： 如果我们写的js代码放在浏览器运行和解析，说明我们是在做前端开发，如果把js放在NodeJS的环境中说明我们在做后端开发了。3.模块划分NodeJS中有很多内置API模块，但是不包含DOM和BOM等浏览器API,所以
2021-11-24 17:49:14
945
原创 字符串扩展、面向对象
一、字符串扩展1.模块字符串模板字符串可以解析变量，使用于大段的字符串而且里面有变量的解析模板字符串可以解析变量 let year = 2021; let month = 11; let day = 16; let str = `今年是${year}年${month}月${day}号`; //今年是2021年11月16号模板字符串里面可以换行，美观 let str2 = `<h3>${year}</h3> <
2021-11-18 14:39:20
202
原创 ES6新语法
一、ES6简介ECMAScript 6.0（以下简称 ES6）是 JavaScript 语言的下一代标准，已经在 2015 年 6 月正式发布了。那么ECMAScript 和 JavaScript 到底是什么关系？ECMAScript 和 JavaScript 的关系是，前者是后者的规格，后者是前者的一种实现。二、let和const1.let块级作用域以前var声明的变量是函数作用作用域 if (true) { var a = 10; }
2021-11-17 11:36:32
575
原创 响应式布局
一、响应式开发原理1.响应式开发原理就是使用媒体查询针对不同宽度的设备进行布局和样式的设置,从而适配不同设备的目的设备的划分情况:小于768的为超小屏幕(手机)768-992之间的为小屏设备(平板)992-1200的中等屏幕(桌面显示器)大于1200的宽屏设备(大桌面显示器)2.响应式布局容器响应式就是在不同屏幕下，通过媒体查询来改变这个布局容器的大小，再改变里面子元素的排列方式和大小，从而实现不同屏幕下，看到不同的页面布局和样式变化。父容器版心的尺寸划分超小
2021-11-13 20:27:52
500
原创 rem+less
一、rem基础1.em和rem我们前面的百分比布局和伸缩布局如果单独使用，页面发生变化的时候，我们的字体大小不会发生变化，而且元素的高度也不会随着屏幕的变化而变化。(1)emem也是一个相对单位，基准是参照父元素字体大小。 <style> html { font-size: 12px; } #box { /* 相当于html的字体大小的2倍，也就是2*12=24em */ font-size
2021-11-13 20:15:33
198
原创 rem+less
一、rem基础1.em和rem我们前面的百分比布局和伸缩布局如果单独使用，页面发生变化的时候，我们的字体大小不会发生变化，而且元素的高度也不会随着屏幕的变化而变化。(1)emem也是一个相对单位，基准是参照父元素字体大小。 <style> html { font-size: 12px; } #box { /* 相当于html的字体大小的2倍，也就是2*12=24em */ font-size
2021-11-09 19:46:38
249
原创 伸缩布局(flex布局)
一、flex布局简介1.flex布局简介我们首先选择的是一个大div里面嵌套四个小div，然后每个小div浮动，但是这种传统的布局方式首先在低版本浏览器上兼容性效果不是很好，另外在移动端的时候布局也会相对比较麻烦。现在我们可以选用一种css3新出的布局方式：伸缩布局来实现上面的页面效果，简单快捷，缺点是pc端兼容性效果较差，所以建议在移动端放心使用，PC端IE11或更低版本不支持flex或仅支持部分2.选择方式1.如果是PC端页面,还是采用传统方式2.如果是移动端或者是不考虑兼容
2021-11-09 09:43:37
1063
原创 php文件编程
1.概念php可以对windows系统中常见的文件类型比如目录、文件等进行操作，我们称之为文件编程。2 .目录操作mkdir(完整路径目录):创建一个目录redir(完整路径目录):删除一个目录opendir(完整路径目录):打开目录 readdir(资源):读取目录closedir(资源):关闭目录,释放内存is_dir(完整路径目录):判断是否为一个有效目录scandir(完整路径目录):扫描目录,返回文件数组$res = scandir('./test');pr
2021-11-04 12:00:04
149
原创 PHP函数
一、库函数1概念库函数分为数学函数、字符串函数、数组函数、目录函数、文件系统函数、时间函数和错误处理函数等几类。这些是php内置的一些函数库，掌握它们的用法，方便我们提高开发效率。2.数学函数其中我们重点了解如下数学函数即可：echo rand(1,10);// 是返回1-10之间的任意的随机数，能取到1和10echo max(10,20,30);//30 求最大值echo min(10,20,30);//10 求最小值echo round(5.6);//6 四舍五入.
2021-10-29 19:27:04
75
原创 正则表达式
一、概念正则表达式(regular expression)描述了一种字符串匹配的模式（pattern），可以用来检查一个串是否含有某种子串、将匹配的子串替换或者从某个串中取出符合某个条件的子串等。二、语法规则1.定义规则$reg='/自己定义的规则/';2.符号简介正则表达式由普通符号和元字符组成。普通字符如下：‘/a/’代表你就要匹配字符a‘/a7/’代表你就要匹配字符a7元字符：是具有特殊意义的符号‘/\d/’ 代表要找寻数字常用的元字符如下..
2021-10-28 16:41:45
78
原创 php连库操作
一、php连接数据库1.mysqli介绍我们可以通过一个mysqli扩展库来实现php连接数据库进行数据增删改查处理操作。在使用mysqli之前先确认一下自己的是不是支持mysqi扩展，随便写一个php文件，里面输入 phpinfo();然后浏览器访问这个php文件，按住ctrl+f出现搜索框以后输入mysqli，看是否支持。2.基础操作步骤$server = "localhost";//设置连接的数据库所在的服务器的ip地址$username = "root"; //设置连
2021-10-27 11:36:24
223
原创 数据库增删改查
一、字段修饰我们创建数据表的时候字段可以添加如下修饰：primary key 是主键的意思，主要是防止添加的字段是重复的not null 表示在该字段添加的值一定不能为空comment 是添加注释的意思auto_increment是自增长的意思二、对数据进行操作1.增加数据插入一条数据insert into 表名(字段1,字段2…) values (值1,值2,…) 插入多条语句：insert into表名（字段1,字段2…）values(值1，值2..),(..
2021-10-22 11:51:06
82
原创 jquery的AJAX
1. jquery封装AJAXJQuery中封装的关于AJAX最常用的方法如下：1、$.get()的用法$.get("请求地址?名=值&名=值",function(res){ res是后台返回的数据 })2、$.post()的用法$.post("请求地址",{名:值,名:值},function(res){ res是后台返回的数据 })3、$.ajax()的用法$.ajax({ url:'xx.php', ...
2021-10-22 11:41:12
79
原创 JSON格式数据
1.什么是JSONJSON: JavaScript Object Notation（JavaScript 对象标记法）。 JSON 是一种存储和交换数据的语法。2.JSON数据语法JSON 语法衍生于 JavaScript 对象标记法语法：数据在名称/值对中 数据由逗号分隔 花括号容纳对象 方括号容纳数组在 JSON 中，值必须是以下数据类型之一：字符串 数字 对象（JSON 对象） 数组 布尔 null3.JSON数据转换1.JSON.parse()
2021-10-22 11:38:09
81
原创 AJAX基础知识笔记
一、AJAX简介1.1 表单提交 <form action="01.php" method="post"> <label for="">请输入用户名</label> <input type="text" /> <label for="">请输入密码</label> <input type="passqord" /> <input type="sub
2021-10-19 10:39:34
64
原创 jQuery属性和动画操作
1.jQuery属性操作jQuery 常用属性操作有三种：prop() / attr() / data() ;元素固有属性值 prop()所谓元素固有属性就是元素本身自带的属性，比如 <a> 元素里面的 href ，比如 <input> 元素里面的 type。语法...
2021-10-13 09:10:22
90
原创 jQuery 样式操作和效果
一、jQuery 样式操作1.操作 css 方法// 1.参数只写属性名，则是返回属性值var strColor = $(this).css('color');// 2. 参数是属性名，属性值，逗号分隔，是设置一组样式，属性必须加引号，值如果是数字可以不用跟单位和引号$(this).css(''color'', ''red'');// 3. 参数可以是对象形式，方便设置多组样式。属性名和属性值用冒号隔开， 属性可以不用加引号$(this).css({ "color":"white
2021-10-12 09:50:39
66
原创 jquery基础知识
一. jQuery 介绍1.JavaScript 库JQuery是JavaScript库，是一个封装好的特定的集合(方法和函数).2. jQuery的优点轻量级。核心文件才几十kb，不会影响页面加载速度。 跨浏览器兼容，基本兼容了现在主流的浏览器。 链式编程、隐式迭代。 对事件、样式、动画支持，大大简化了DOM操作。 支持插件扩展开发。有着丰富的第三方的插件，例如：树形菜单、日期控件、轮播图等。 免费、开源。二、 jQuery 的基本使用1.jQuery的入口函数.
2021-10-12 09:13:33
58
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人