- 博客(40)
- 收藏
- 关注
原创 1.uni-app入门与实战的笔记。
一.一套代码发布与各个平台(微信小程,QQ小程序,百度小程序,字节迪跳动的小程序,支付宝小程序,android端,IOS端,H5版)二.跨端框架。是未来的技术发展趋势方向。 推送 统计 广告 深受企业和开发者青睐。三:uni-app 6大优点:1.跨端完善度更高,真正落地提高生产力。2.在跨端的同时 通过条件编译+平台特有的API调用。可以优雅为某平台写个性的代码。调用专有能力,而不影响其他的平台。支持原生代码的混写和原生sdk编写。3.性能体验更加优秀:更好的Hybrid框架.
2020-06-10 11:54:13
338
原创 7.访问API数据与ES6语法在小程序中的应用。
1.本章节介绍第6章页面没有实现获取API的数据,流行页面使用5个组件来完成,每个组件是需要数据来填充的,从服务器取数据,然后分门别类的传递到组件中去。2.获取数据GET 提交数据POST (评论) 更新数据PUT3.获取API 最新的数据,应该在111OnLoad声明周期函数中,因为我们要第一时间获取服务器返回的数据,而222onShow和3333 OnRead 要比OnLoad晚点执行4.wx.request(Object) 专门向服务器发送数据请求的,可以参考官网说明使用方法:..
2020-05-30 22:54:55
192
原创 第7章函数表达式(红宝书)
1.在正常的浏览器中,我们可以打印出 定义函数的函数名 IE除外function demo(){ //函数体}console.log(demo.name); //demo2.函数声明具备函数声明提升的功能而函数表达式又称匿名函数它没有提升的功能: demo() // function demo(){ // console.log("this is test1"); //this is test1 ...
2020-05-30 18:40:58
170
转载 关于this 指向问题
前言js中this指向问题是个老生常谈的问题了,下面这篇文章再来给大家介绍下,大家可以看看,更深入的了解了解,下面话不多说了,来一起看看详细的介绍吧thisthis:上下文,会根据执行环境变化而发生指向的改变.1.单独的this,指向的是window这个对象 1 alert(this); // this -> window 2.全局函数中的this 1 2 3 4 function de
2020-05-30 15:39:34
196
原创 6.组件数据 事件与属性
1.数据的来源: 有如下三种形式途径:1.1 在wxml 里面的静态资源也是 一种数据获取的途径1.2 从js中获取数据,渲染到wxml。这是数据绑定的方式实现的。组件内部的数据,一般选择在data内定义,这种途径控制数据,优点是:不会让数据写死的,可以动态的控制变量多少。扩展知识:1.2.1在业务逻辑中,我们会用到三元表达式。一些数据,属性,以及方法我们是需要封装在内部的 。组件的封装性,开放性,粒度:就是要简单的封装,还是复杂的封装。需要开放的数据(就是可以在组件的.
2020-05-28 21:24:35
138
原创 5.小程序基础知识与初始小程序组件
1.期刊展示:电影 音乐 句子 期刊是从08-01期 左右按钮 到底了 图标按钮变成灰色。 这个期刊我们使用的是缓存的。 音乐的控制面板 和音乐的播放的 状态控制一直。点击03期刊,那么回到07期刊,音乐处于暂停状态。2.书单 头部的搜索书籍框 是固定在头部的,不会随着页面滚动而滚动,有没有实现。触发点击书籍的时候,当前的页面,不会跳到子页面去。直接覆盖在原来的书单上面。 加载更多load小图标3.书籍的详情,按照段落进行文字的换行呢。点击输入短评,有没有用黑色的遮罩,把屏幕给覆...
2020-05-28 20:34:10
185
原创 4.flex布局基本使用方法
1.1 代码的规范,JS大规范 驼峰式命名法。每一行JS代码到底要不要加分号(不加分号)1.2 微信小程序布局,首选flex布局,因为微信小程序对flex布局很友好。根据 sitemap 的规则[0],当前页面 [pages/classic/classic] 将被索引这个微信小程序更新后,检索的设置,可以在配置里面project.config.json中添加setting中配置字段checkSiteMap设置为false 重新刷新页面就可以解决了。1.4块级元素默认占据一整..
2020-05-28 15:37:21
279
原创 1-1Vue购物车(商城核心页面的知识点记录) axios 使用
一。使用axios 和vue-axios 来获取static/mock/ 数据。我们要知道只有static文件夹可以被外部访问到。所以我们先把假数据放在static/mock下面 然后在methods里面定义获取的方法,然后在mounted(){}中使用。因为整个Vue实例已经初始化完成了。 methods:{ // 拉取数据 会把axios 挂载到vue实例化对象中上面去 cartInit(){ // 这是发送一个GET 请求 返回的是promi..
2020-05-27 16:51:52
205
原创 Vue优点
Vue 具有易用性 灵活性 高效性1.易用性: <div id="app">{{message}}</div>var app = new Vue({ el:'#app', data:{ message:'Hello Vue' } })2.灵活性:声明了message 然后在view视图层 我们就渲染上去了。(声明式组件)组件系统(具有复用性) 多个页面的跳转 我们就需要使用客户端路由,状态管理(vuex)项目庞.
2020-05-27 16:41:57
683
原创 1-6 计算属性(computed) 方法(method) 侦听器() 计算属性中的get set 用法
1.计算属性(存在缓存机制,性能高,代码精简)computed:{ 计算属性中 函数中的变量 如果没有变化的话,那么就不会在重新执行 这就是具备缓存机制的 fullName:function(){ console.log("计算了一次"); return this.lastName+' '+this.firstName; ..
2020-05-26 18:00:02
193
原创 1-5基本方法
1.父组件向子组件传值:(数据)通过:v-bind:形式来进行数据的传递,父组件给子组件传值,子组件一定接收2..子组件向父组件传值:(触发事件)通过this.$emit() 通过触发事件,父组件恰好在监听,监听过后,就能带出来的内容。从而实现子组件向父组件传递的功能3.模板语法:<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <met
2020-05-26 16:59:25
122
原创 1-3MVC MVVM MVP和1-4(组件化概念)
1-3:MVVM MVP都是有MVC延伸而来的,都是之前比较老的框架,使用的是MVC.MVP 是Jquery 框架的思想 MVVM 是Vue 思想 上图解释。一:MVC(1)View 传送指令到 Controller(2)Controller 完成业务逻辑后,要求 Model 改变状态(3)Model 将新的数据发送到 View,用户得到反馈。所有通信都是单向的。二:MVP(1)各部分之间的通信,都是双向的。(2)View 与 Model 不发生联系,都通过 ...
2020-05-25 20:47:44
139
原创 1-1和1-2
1-11.HelloWorld 当我们想实现 打印HelloWorld的时候,我们使用原生的JavaScript方式实现的方式是: <div id="app"></div> <script> // 获取DOM 节点 var app = document.getElementById("app"); // ES5 插入内容 app.innerHTML = "HelloWorld"; &
2020-05-25 17:44:26
141
原创 Vue基础复习二
列表渲染,可以遍历对象和数组:在同一个标签中,不能同时使用v-if和v-for. v-for 再带的属性:key 这个不能乱用 尽量使用 结构中唯一的key。<template> <div> <p>遍历数组</p> <ul> <li v-for="(item,index) in listArr" :key="item.id"> {{index}}----- {{item.id}.
2020-05-24 16:57:33
102
原创 Vue 基础复习一
1. 插值 表达式 动态属性(setAttribute JSES5) v-html(理解是innerHTML(JSES5))实例如下:<template> <div> <!-- 第一知识点 插值 --> <p>插值 {{message}}</p> <!-- 第二知识点 表达式 --> <p>JS {{age?'yes23':'no'}...
2020-05-24 09:36:22
328
原创 1.申请appkey 2.准备工作 3.小程序基础知识与特性 小程序开发笔记与心得。
微信小程序商业级开发实战:笔记:第一章申请appkey1-1.提供:RESTFul API。什么是RESTFul API:REST,即Representational State Transfer的缩写。意思是"表现层状态转化"。它是一种互联网应用程序的API设计理念:URL定位资源,用HTTP动词(GET,POST,DELETE,DETC)描述操作。一套协议来规范多种形式的前端和同一个后台的交互方式就是前端部分使用接口去请求服务器端的数据,然后服务器端响应了,返回数据给前端的一种..
2020-05-20 17:01:17
1116
1
转载 sass-loader node-sass 报错是什么问题
1、vue项目安装node-sass,sass-loader(1)安装sass-loader、node-sass1)方法一:npm安装npm install sass-loader node-sass -D优点:安装的数据齐全缺点:安装速度慢2)方法二:cnpm安装(国内淘宝镜像安装)安装cnpm:npm install -g mirror-config-china --registry=http://registry.npm.taobao.org安装node-sass,s.
2020-05-18 07:45:48
389
原创 Vue-router使用方法
Vue-router 使用方法:目的是路由在不同页面中的跳转在搭建项目的时候,vue init webpack my-project 会默认提示我们是否安装,路由跳转的。当我们默认选择y 的时候,在App.vue 根组件中,默认的是存在<router-view> 这个是vue实例存在的 表示路由的视图 <router-link> 相当于HTML的a链接,跳转。第一个要求,实现A页面和B页面的跳转 当输入http://localhost:8080/a 跳转到A路由页面当
2020-05-17 18:20:55
335
原创 display:none和visibilty:hidden区别与联系
display:none和visible:hidden相同点:都能把网页上某个元素隐藏起来。不用点:display:none不为被隐藏的对象保留其物理空间,即该对象在页面上彻底消失,通俗来说就是看不见也摸不到。渲染时不再占据任何空间,会让元素完全从渲染树中消失 (DOM树)。visible:hidden;使对象在网页上不可见,但该对象在网页上所占的空间没有改变,通俗来说就是看不见但摸得到。渲染元素继续占据空间,只是内容不可见,不能点击。...
2020-05-15 17:18:55
328
原创 清除浮动的常用方法
1.最推荐的方法,一定要写在首文中了。因为浮动导致元素父元素塌陷问题。最经典的写法是:.clearfix::after{content:' ';display:table;clear:both;}.clearfix{*zoom:1; /*兼容IE低浏览器*/}2.块级格式化文本BFC:只需给父元素创建块级格式化上下文,就可以让浮动的元素参与高度计算,这样一来,父元素的高度就有了。overflow:hidden;overflow:hidden较多的原因是不.
2020-05-15 17:01:58
85
原创 VScode 常用的插件
1.Auto Close Tag自动添加HTML/XML关闭标记2.Auto Rename Tag 自动重命名成对的HTML/XML标记3.Chinese (Simplified) Language Pack for Visual Studio Code:此中文(简体)语言包为 VS Code 提供本地化界面。(汉化的)4.Color info :提供颜色信息5.Community Material Theme 安装主题色6.css peak:HTML与css关联7.css-...
2020-05-15 12:17:35
166
原创 CSS+HTML学习总结
1.设计师给我们设计稿 例如是:两列标题,左边是标题右边是一堆图标那么我们就要思考问题左边的标题会不会变多右边的图标会不会变多设计思路。例如:所有的可点击的区域,必须要有cursor:pointer;(这是我们必须的基本)2.在项目开发的时候,关注性能和工程的成本: 能做表示的是技术的可行性兼容不同的浏览器手机端问题,性能的问题能不能做性能的问题思考。3.一定要学会和设计师做合理的沟通。4.面试的简历,必须保持真实,要不然会直接被pa...
2020-05-14 22:38:11
223
原创 cnpm run dev
$ npm run devnpm ERR! code ENOENTnpm ERR! syscall opennpm ERR! path F:\mpvueProject\package.jsonnpm ERR! errno -4058npm ERR! enoent ENOENT: no such file or directory, open 'F:\mpvueProject\package.json'npm ERR! enoent This is related to npm not being
2020-05-12 12:00:54
509
原创 响应式布局 一
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>re.
2020-05-08 23:59:00
134
原创 float经典三列布局,inline-block固定两列布局
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>Do.
2020-05-08 23:52:45
187
原创 CSS布局,表格布局,flex布局,定位
CSS知识体系的重中之重早期以table为主(简单)后来以技巧性布局为主(难)现在有girdflexbox(偏简单)移动端:响应式布局是必备知识。table表格布局float(浮动)+marginflex布局inline-block转换成块元素布局。2.表格布局<!DOCTYPE html><html lang...
2020-05-08 23:47:57
385
原创 CSS边框,背景,滚动,颜色值
1.什么是背景?概念 在容器中做底层铺垫,不会影响,正文的排布2CSS颜色有如下的几种写法 rgb() rgba() 单词:black(黑色) 十六进制#000000==rgb()表示方式 hsla() h:色调,取值0-360,颜色的底色调,表示色轮周围的角度s:饱和度,取值0%-100%,0是没有颜色显示为灰色,100%是全彩色l:亮度,取值0...
2020-05-08 23:25:28
264
原创 CSS3布局行高
<!DOCTYPE html><html><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compati...
2020-05-07 18:26:05
197
原创 CSS字体默认样式设置
//1.字体族:表示一堆字体的东西分类如下 衬线字体serif宋体就是衬线字体带有弯弯勾勾的样子 非衬线字体sans-serif不带有弯弯勾勾的样子 monospace等宽字体每一个字母站的空间的都是一样 cursive连笔的;草书的;草写体的手写的字体广告宣传中用的多 ...
2020-05-07 18:24:14
992
原创 CSS解析过程,权重理解
1.什么叫选择器?答:就是匹配HTML元素的2.浏览器怎么解析CSS的是从右向左解析这样可以提高解析的速度性能提高。浏览器解析方式从上至下浏览器下载的顺序是从上到下,渲染的顺序也是从上到下,下载和渲染是同时进行的并且在下载后进行解析,解析过程中,停止页面所有往下元素的下载。此时渲染会...
2020-05-07 18:17:58
120
原创 CSS基础选择器案例总结:
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>测试权重 不越级的特...
2020-05-07 18:12:41
218
原创 HMTL经典的面试个人复习总结
1.DOCTYPE真正的意义是什么?//答:1.1让浏览器以标准来渲染。(IE6盒子模型)内容的宽度指的是而是内容、内边距和边框的宽度的总和。 (Chrome盒子模型 我这里理解就是正常的盒子 标注Chrome 全部都是正常的情况下) 内容的宽度指的是 ...
2020-05-07 18:09:44
62
原创 1.HTML嵌套关系**
1.HTML嵌套关系 // 1.块级元素可以包含行内元素 div > span // 2.块级元素不一定能包含块级元素 // div >div 块级元素包含块级元素 // section > div 块级元素包含块级元素 // p(段落) > div 这是错误的写法```// 3.行内元素一般不能包含块级元素 ...
2020-05-07 18:00:32
270
原创 HTML 理解 和元素的分类:
HTML理解二:1.如何理解HTML: 1.1HTML具有文档 1.1描述文档结构 1,2有区块和大纲 可以和word类比是同理的 2.HTML具有语义化的标签去编写而不是这边一个div 那边一个div对搜索引擎爬虫都是不友好的 可以使用开源插件查看HTML文...
2020-05-07 17:53:24
99
原创 代码练习的演示
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <!-- 是IE8的专用标记,用来指定I...
2020-05-07 17:45:11
128
原创 HTML常见元素和理解 一
不会CSS的前端只能叫伪前端1.HTML常见元素和理解 HTML 结构 CSS 样式 JavaScript 行为 2.HTML版本 3.HTML元素分类 4.HTML元素嵌套关系 5.HTML元素默认样式和定制化 6.HTML面试真题解答1.HTML常见元素head头部部分:meta title stylescript link ba...
2020-05-07 17:41:20
113
翻译 HTML元素分类
一: 分为三大类:1.结构语义:定义元素在HTML 文档中扮演的结构角色。有如下标签:div: 在文档中的定义一块区域,包含框,IE认为他是一个容器。(块元素)span:在文本中定义一个区域(行内元素)ul:没有排序的列表li:每条列表的项ol:一定的排序进行的列表dl:定义方式的列表dt:定义列表中的词条dd:对定义的词条进行解释del:定义删除的文本ins:定义插入的文本...
2020-05-07 17:25:49
219
原创 HTML基础语法使用
HTML基础语法: HTML基本语法 文本格式标签 <p> 标签标识段落文本<!-- 2.字符格式标签的文本 --><b>标识强调文本,以加粗效果显示。</b><i>标识引用文本,以斜体效果显示。</i><em...
2020-04-04 15:17:48
130
转载 JavaScriptDOM操作节点遍历的四种方法
节点遍历方法第一种,使用第二套DOMAPI 关系 遍历// 元素节点的遍历方法 第一种 // var box = document.getElementById("box"); // for(var i=0,len = box.children.length;i<len;i++){ // console.lo...
2020-02-18 17:25:01
1844
3
原创 JavaScriptDOM操作之DOMReady实现策略以及与windowonload setTimeout区别
一.setTImeout(code,millisecond)功能:在指定的毫秒数后调用函数或计算的表达式参数说明:code:要调用的函数或要执行的代码串,millisecond:在执行前需要等待的毫秒数。页面存在一定的时间才能显示样式,如果毫秒数设置过小,DOM准备时间超过毫秒数时,根本检测不到二.window.onload = function(){}:解释:当页面的HTML 文...
2020-02-13 10:26:35
198
1
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人