- 博客(27)
- 收藏
- 关注
RSS订阅原创 小程序页面导航
1.什么是页面导航页面导航指的是页面之间的相互跳转2.小程序中实现页面导航的两种方式（1).声明式导航 在页面上生明一个导航组件 通过点击组件实现页面跳转(2)编程式导航调用小程序的导航API，实现页面跳转3.声明式导航 导航到tabBar页面导航到非tabBar页面 注意：为了方便，在导航到非tabBar页面时，open-type属性可以省略4.后退导航 注意，如果只后退到上衣页面，可以省略delta属性，其默认值...
2022-06-20 12:06:33
414
1
原创 小程序全局配置
小程序根目录下的app.json文件是小程序的全局配置文件。常用配置项如下：1.pages 记录当前小程序所有页面的存放路径2.window 全局设置小程序窗口的外观3.tabBar 设置小程序底部的tarBar效果4.style是否启用新版的组件样式2.了解window节点常用的配置项属性名类型默认值说明navigationBarTitleTextString字符串导航栏标题文字内容navigationBarBackgroundColorHexColor#0000
2022-06-20 11:30:45
418
原创 CORS解决跨域
CORS (Cross-Origin Resource Sharing) ：跨域资源共享，CORS是官方的跨域解决方案，完全交给后端进行处理，支持get，post请求。跨域资源共享标准新增了一组 HTTP 首部字段（响应头），允许服务器声明哪些源站通过浏览器有权限访问哪些资源CORS怎么工作;CORS通过设置一个响应头来告诉浏览器，该请求允许跨域，浏览器收到该响应后会对响应放行代码实现客户端<script> (function(){ co
2022-05-09 11:33:00
230
原创 Jsonp解决跨域问题
原理：有些标签天生具有跨域能力，比如：img，link，iframe，script，Jsonp就是利用script的跨域能力来发送请求的，服务器端返回的是一个回调函数，由于jsonp只能请求资源文件，所以Jsonp只能发送get请求.原生ajax发送jsonp <script> // 创建一个script标签 let script = document.createElement('script') // 设置script的src
2022-05-09 11:11:00
249
原创 Vue插槽
1.默认插槽父组件中引用子组件标签(vc)，并且在其中写其他内容<template> <div> <vc> <h1>Hello Slot</h1> </vc> </div></template>在子组件中通过slot进行接受，将组件中的内容放置在指定位置<template> <div&...
2022-03-06 22:47:23
288
原创 Vue中消息订阅和发布（pubsub）
消息的订阅与发布：组件订阅消息，等待组件发布消息（可带参数）后，执行订阅消息后面的回调函数，完成组件间通信安装并使用：首先通过npm安装对应库 npm i pubsub-js在App.vue中引入库import pubsub from 'pubsub-js'使用方法：// 消息发布 pubsub.publish('publishName,params) //订阅消息this.xxx = pub...
2022-03-06 22:21:15
400
原创 Vue中的事件总线
事件总线是为方便vue中组件之间的通信而出现的核心原理：VueComponent.prototype.__proto__ === Vue.prototype通俗来讲就是组件vc的实例对象可以访问到Vue原型对象上的方法，因此可以在vue原型对象上创建一个对象，这样所有的组件实例vc都能访问该对象从而实现组件间通信创建事件总线：new Vue({ render: h => h(App), beforeCreate(){ Vue.prototype.$bus = t
2022-03-06 22:07:20
782
原创 Vue中的ref
通过ref属性绑定标签，可以获取对应的标签DOM节点用法：<h1 ref='h1'>{{msg}}</h1>获取真实DOM节点（通过Vue对象上的$refs属性获取）： console.log(this.$refs.h1);
2022-03-06 21:32:45
327
原创 Vue实例对象
const vm = new Vue({ // 绑定的容器 el: '#root', // 对象式 data: { name: 'wx', n: 1 }, // 函数式 // data(){ // return { // name:'wx' // } ...
2022-02-26 21:44:38
536
原创 Vue内置指令
v-bind 单项绑定 v-bind:value='xxx === :value='xxx<input type="text" v-bind:value="name" >v-model 双向绑定 通常用于收集value值 v-model:value='xxx ===v-model='xxx<input type="text" v-model:value="name">v-on 事件绑定 简写 @<button @click="fun">{{nam
2022-02-26 21:17:31
292
原创 mvvm模型
mvvm（Model-View-ViewModel) 即 模型-视图-视图模型，是MVC改进版，M: Vue中data里的数据V: 视图 ，html里的模板VM: Vue实例对象
2022-02-26 20:24:21
404
原创 js中数组的常用方法(es6)
JS数组常用方法1.concat连接两个字符串 const arr = [1,2] const arr2 = [3] console.log(arr.concat(arr2)) //1,2,32.join将数组转成字符串 const arr = [1,2] const arr3 = arr.join('-') console.log(arr3) //1-23.push & unshift往数组最后或者开头添加
2022-02-21 16:27:21
1228
原创 tsconfig.json
{ // 执行编译的目录 "include": ["./"], // 不执行编译 // "exclude": [], // 更多编译选项 "compilerOptions": { // targer指定ts编译成js的版本 ,默认es3 "target": "ES3", // "module": "es2015", // 输出路径 "outDir": "./build/", ...
2022-02-16 15:10:56
307
原创 npm脚本
在当前文件夹建立一个package.json或者使用已创建的package.json文件{ "scripts": { "start": "webpack server -c ./config/webpack.config.dev.js", "build": "webpack -c ./config/webpack.config.prod.js" }}脚本代码如上，运行代码为 npm run start ===webpack ser..
2022-02-14 20:40:14
291
原创 Gulpfile.js
css和js打包以及webserver服务器启动和watch监视var gulp = require('gulp')var concat = require('gulp-concat')var uglify = require('gulp-uglify')var rename = require('gulp-rename')var cssmin = require('gulp-cssmin')const autoPrefixer = require('gulp-autoprefixer')
2022-02-12 21:44:54
431
原创 Gulp常用插件
插件一般都下载到本地开发环境中下载命令 npm i pluginsName -Dgulp常用插件 1. gulp-cssmin 用来压缩css文件 2. gulp-autoprefixer 用来给css添加前缀 传递参数({browsers: [要兼容的浏览器]}) 3.gulp-concat 合并js文件，组成一个新的js文件 4.gulp-uglify 压缩js文件 5....
2022-02-12 21:42:19
612
原创 Gulp常用api
1. gulp.task<!-- 创建一个gulp任务 -->用法：gulp.task('taskname',function(){})2. gulp.src<!-- 指定文件路径 -->gulp.src('src/js/**/*.js')3. gulp.dest()<!-- 把内容输出当指定文件 -->gulp.dest('dist/js/')4. gulp.watch()<!-- 监视文件，文件一旦改.
2022-02-12 17:42:29
348
原创 Gruntfile.js
module.exports = function (grunt) { // Project configuration. grunt.initConfig({ concat: { options: { separator: ';', }, dist: { // src: ['src/intro.js', 'src/project.j.
2022-02-11 22:21:17
220
原创 Grunt初始化
Grunt 中文主页 : http://www.gruntjs.net/Grunt 一个自动化构建工具，基于nodejs的命令行工具，拥有及其强大的插件创建一个简单的应用grunt_test|- build----------构建生成的文件所在的文件夹|- src------------源码文件夹|- js---------------js源文件夹|- css--------------css源文件夹|- index.html-----页面...
2022-02-11 21:25:10
73
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人