古雅学长-优快云博客

一、Uni_app中图片的上传1、先创建一个上传图片的按钮<view> <button type="primary" @click="chooseImg">上传图片</button></view>2、在chooseImg函数中用uni.chooseImage方法进行上传图片，export default { data () { return { // 定义一个数组并返回 imgArr:[] } }，

2022-05-10 03:21:30 946

原创 Uni-app 中同步和异步的数据存储、数据获取、数据删除

一、数据存储uni.setStorage（Object）1、数据的异步存储uni.setStorage（Object）//先定义一个存储数据的按钮<button @click="setStorage" type="primary">数据存储</button>// 存储数据 setStorage () {// uni.setStorage(object)将数据存储在本地缓存中指定的 key 中，会覆盖掉原来该 key 对应的内容，这是一个异步接口。 // 异步

2022-05-09 04:24:22 5012

原创 uni_app的基础知识

一、uni-APP里的视图和文本标签<view> //视图标签view //文本标签 <text selectable="true"> //selectable设置文字是否为可选我是不能选中的文字 </text></view>

2022-05-08 02:13:11 665

原创 Uni-app中的页面触发函数、数据刷新、get请求、字体引用~@/static/

一、Uni-app中的页面触发函数onLoad页面加载了、onShow页面显示了、onReady页面初次渲染、onHide页面隐藏export default { data() { return { title: 'Hello' } }, onLoad(object) { console.log('页面加载了，我可以页面传参',object) }, onShow() { console.log('页面显示了') }, onReady() {

2022-05-06 19:54:38 3579

原创 uni-app中配置文件、内链样式、刷新加载、全局样式、底部按钮

一、uni-app 中pages.json的配置1、pages数组中第一项表示应用启动页pages": [ //pages数组中第一项表示应用启动页，参考：https://uniapp.dcloud.io/collocation/pages { "path":"pages/index/index", "style":{ // 设置下拉 "enablePullDownRefresh":true } }]二、pages.json中的内链样式设置1、navigation

2022-05-06 15:54:21 832

原创 CSS3 动画序列

@keyframes move { /* 开始状态 */ 0% { transform: translateX(1000px); } /* 结束状态 */ 100% { transform: translateX(100x); }}div { width: 200px; height: 400px; background-color: hotpink; /* 动画名称 */ animation-name: move; /* 持续时间 */ animation-dur

2020-09-21 20:14:53 289

原创 Node.js

Node.js 的特点单线程：单线程的好处，减少了内存开销，操作系统的内存换页。非阻塞I/O：不会傻等I/O语句结束，而会执行后面的语句。事件驱动：底层代码中，近半数都用了事件队列、回调函数队列的构建。...

2020-09-16 18:52:40 170

原创 Composer的使用方法

1、创建一个文件夹，在文件夹中创建一个composer.json文件2、在composer.json文件中写入如下代码{ "require":{ "smarty/smarty":"3.1.36" //厂商名/需要的类名：版本号 }}3、在命令提示符中输入如下命令C:\Users\ASUS>C: 项目所在盘符C:\Users\ASUS>cd C:\wamp64\www\使用Composer\使用Composer 项目的根目录C:\wamp64\www\使用Co

2020-09-14 20:54:39 660

原创 ES6 中的模板字符串【··】

一、ES6 引入新的声明字符串的方式 ``1、声明2、内容中可以直接出现换行符<script> // ES6 引入新的声明字符串的方式『``』 '' "" //1. 声明 // let str = `我也是一个字符串哦!`; // console.log(str, typeof str); //2. 内容中可以直接出现换行符 let str = `<ul>

2020-09-14 16:40:19 352

原创 ES6中的 let 声明变量

1. 变量不能重复声明//声明变量 let a; let b,c,d; let e = 100; let f = 521, g = 'iloveyou', h = [];let star = '罗志祥';let star = '小猪';2. 块儿级作用域全局, 函数, evalif else while for { let girl = '周扬青'; } console.log(girl);3. 不存在变量提升，提前输出console.log(son

2020-09-14 14:19:44 186

原创 VUE 使用 watch 监听路由

<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> <script src="lib/vue-2.4.0.js"></script>  <script src="./lib/vue-router.js"></script> </hea

2020-09-14 12:31:04 335

原创 VUE 使用计算属性(computed) 实现双向数据绑定

<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> <script src="lib/vue-2.4.0.js"></script> </head> <body> <div id="app"> <input type="text" v-model="lastn

2020-09-14 12:30:21 1611

原创 VUE 使用watch 实现双向数据绑定

1、使用watch 实现双向数据绑定<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> <script src="lib/vue-2.4.0.js"></script> </head> <body> <div id="app"> <input type="

2020-09-14 12:28:51 618

原创 VUE 原生实现双向数据绑定

<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> <script src="lib/vue-2.4.0.js"></script> </head> <body> <div id="app"> <input type="text" v-model="lastn

2020-09-14 12:27:41 183

原创 VUE 路由的基本使用

1. 引入路由 <script src="./lib/vue-router.js"></script> </head> <body> <div id="app"> <router-link to="login">登录</router-link> <router-link to="register">注册</router-link>

2020-09-14 12:25:44 176

原创 VUE 命名视图实现经典布局

<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> <script type="text/javascript" src="js/vue.js"></script> <link rel="stylesheet" type="text/css" href="css/bootstrap.min.css"&gt

2020-09-14 12:21:10 142

原创 VUE 路由规则中定义参数

<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> <script type="text/javascript" src="js/vue.js"></script> <link rel="stylesheet" type="text/css" href="css/bootstrap.min.css"&gt

2020-09-14 12:20:23 413

原创 VUE 中 vue-router 的使用

<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> <script type="text/javascript" src="js/vue.js"></script> <link rel="stylesheet" type="text/css" href="css/bootstrap.min.css"&gt

2020-09-14 12:19:32 171

原创 VUE 中 ref 获取DOM元素和组件

ref 获取DOM元素和组件<div id="app"> <input type="button" value="快到碗里来" @click="getElement" ref="mybtn"> <h3 id="myh3" ref="myh3">哈哈哈，今天天气太好了！！！</h3> <login ref="mylogin"></login></div> var login = { template:'&l

2020-09-13 14:13:03 505

原创 VUE 中，父组件向子组件传递方法

VUE 中，父组件向子组件传递方法使用的是事件绑定机制<com2 v-on:func="show"></com2>当点击子组件的按钮的时候，如何拿到父组件传递过来的 func 方法，并调用这个方法？myclick(){emit 英文愿意：是触发，调用、发射的意思 this.$emit('func',123,456)}methods:{ show(data,data2){ console.log('调用了父组件身上的 show 方法：---' + data

2020-09-13 13:09:36 799

原创 VUE 中定义私有组件、组件中的 data、组件切换

1、通过 components 定义私有组件var vm2 = new Vue({ el:'#app2', data:{}, methods:{}, components:{//定硫仪私有组件 login:{ template:'#tmpl2' } }})<div id="app2"> <login></login></div><!-- 通过 c

2020-09-12 14:34:36 474

原创 VUE 中组件的三种创建方式

第一种方法，创建全局的vue组件var coml = Vue.extend({ // 通过template 属性指定组件要展示的结构 template:'<a><h1>这是使用 Vue.extend 创建的组件</h1></a>'})如果使用 Vue.component 定义全局组件的时候，组件名称使用了驼峰，就得用 - 来连接驼峰改为小写使用Vue.component('组件名称'，'创建出来的组件模板对象')Vue.component('

2020-09-12 13:04:50 1549

原创 VUE中动画的配合使用

能够实现列表的元素，渐渐离开的效果.v-enter,.v-leave-to{ opacity:0; transform:translateY(80px);}.v-enter-active,.v-leave-active{ transition:all 0.6s ease;}能够实现列表后续的元素，渐渐地飘上来的效果.v-move { transition:all 0.6s ease;}.v-leave-active{ position:absolute;}<tr

2020-09-12 09:52:38 156

原创 VUE 中的动画

<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> <script type="text/javascript" src="js/vue.js"></script> <style> .ball{ width:15px; height:15px; border-radiu

2020-09-09 11:10:46 107

原创 VUE 中的 AJAX 请求

1、如果我们通过全局配置了，请求的数据接口根域名，则，在每次单独发起 http 请求的时候，请求的 url 路径，应该以相对路径开头，前面不能带 / ，否则不会启用根路径做拼接； getAllList() { // 获取所有的品牌列表 // 分析： // 1. 由于已经导入了 Vue-resource这个包，所以，可以直接通过 this.$http 来发起数据请求 // 2. 根据接口API文档，知道，获取列表的时候，应该发起一

2020-07-17 16:18:17 519

原创英语四级词汇

四级词汇radicala radical measurea radical policya radical differencea political radicalamplample opportunitiesprovide ample spaceample mineral resourcesan ample supply of waterrapida rapid changerapid growtha rapid pulsea rapid heartbeatvoyage

2020-07-13 19:14:53 425

原创 Sass 混合器与继承

1、Sass中的混合器类似于js的函数，将一段代码定义成混合器以实现代码的重用声明混合器：@mixin mixName调用混合器 @include minName如@mixin border-round{ -moz-border:1px solid red; -webkit-border:1px solid red; border:1px solid red}#top{ @include border-round;}//编译后#top { -moz-border: 1px so

2020-06-29 19:38:02 418

原创 Sass学习 sass 命令、sass变量、编译时报错、嵌套css规则、群组选择器、子选择器，相邻，同级选择器、属性嵌套、import导入、import默认值、sass注释、sass中文乱码

一、目录在这里插入代码片常用命令变量嵌套css规则群组选择器子选择器，相邻，同级选择器属性嵌套 import导入嵌套导入 sass注释 sass乱码解决常用命令1、sass 命令sass input.scss output.css:将sass文件输出到指定css文件sass --watch input.scss:output.css:自动监视sass文件更新到指定css文件sass --watch app/sasss:public/styles:sass监视一个目录里面的sass文件

2020-06-29 19:29:05 1076

原创 VUE 生命周期函数 beforeCreate、created、beforeMount、mounted

1、这是我们遇到的第一个生命周期函数,表示实例完全被创建出来之前,会执行它，注意:在 beforeCreate 生命周期函数执行的时候, data 和 methods 中的数据都还没有初始化beforeCreate (){ // 这是我们遇到的第一个生命周期函数,表示实例完全被创建出来之前,会执行它 // 注意:在 beforeCreate 生命周期函数执行的时候, data 和 methods 中的数据都还没有初始化},2、这是遇到的第二个生命周期函数，在 created 中,data

2020-06-22 20:33:58 10156

原创 VUE 自定义全局按键修饰符、使用 Vue.directive() 自定义全局的指令、自定义私有指令

1、自定义全局按键修饰符<label for="">试试 F2 ：<input type="search" @keyup.113="add"></label><label for="">试试 F2 ：<input type="search" @keyup.f2="add"></label>//自定义全局按键修饰符Vue.config.keyCodes.f2 = 113methods:{ add(){ alert(

2020-06-22 15:51:24 471

原创 VUE 中，过滤器的使用、全局和私有过滤器、字符串的padStart()方法使用

1、过滤器的定义语法,过滤器中的 function,第一个参数,已经被规定死了,永远都是过滤器管道符前面传递过来的数据，过滤器调用的时候的格式 {{ name | 过滤器的名称 }}Vue.filter('过滤器的名称',function() {}) //过滤器中的 function,第一个参数,已经被规定死了,永远都是过滤器管道符前面传递过来的数据 //过滤器调用的时候的格式 {{ name | 过滤器的名称 }} Vue.filter('过滤器的名称',function (d

2020-06-22 12:37:26 240

原创 VUE 中的搜索关键字

1、定义一个搜索框<label> 搜索关键字： <input type="search" name="" id="" value="" v-model="keywords"/></label>2、循环遍历，之前，v-for 中的数据，都是直接从 data 上的list中直接渲染过来的，现在，我们自定义了一个 search 方法，同时，把所有的关键字，通过传参的形式，传递给了 search 方法，在 search 方法内部，通过执行 for 循环，把所有符合

2020-06-22 09:45:52 3963 1

原创 VUE 计算属性computed、

1、计算属性缓存 vs 方法基础例子1、computed用来监控自己定义的变量，该变量不在data里面声明，直接在computed里面定义，然后就可以在页面上进行双向数据绑定展示出结果或者用作其他处理；2、computed比较适合对多个变量或者对象进行处理后返回一个结果值，也就是数多个变量中的某一个值发生了变化则我们监控的这个值也就会发生变化，举例：购物车里面的商品列表和总金额之间的关系，只要商品列表里面的商品数量发生变化，或减少或增多或删除商品，总金额都应该发生变化。这里的这个总金额使用comput

2020-06-21 21:16:21 157

原创 Laravel 安装 debugbar 工具条，配置虚拟主机

阿里云镜像：composer config -g repo.packagist composer https://mirrors.aliyun.com/composer/安装 debugbar 工具条，要求php版本大于等于7.0https://packagist.org下载地址：https://packagist.org/packages/barryvdh/laravel-debugbar命令：composer require barryvdh/laravel-debugbar --dev安装

2020-06-20 17:07:20 209

空空如也

空空如也