Vue前端框架
关注
分享
扫一扫
文章平均质量分 54
嫣夜来
这个作者很懒，什么都没留下…
展开
-
uni-app集成极光推送插件后真机调试提示“当前运行的基座不包含原生插件[JG-JPush]...”问题的解决办法
uni-app继承极光推送真机调试问题解决原创 2022-06-23 17:09:36 · 3910 阅读 · 6 评论 -
linux系统下docker搭建vue前端项目开发运行环境详解
1、 初衷最近做了几个前后端项目，在前后端项目链条的时候，发现在windows系统下安装前端发过来的vue项目的依赖的时候各种报错， npm install一直无法安装，但是我在linux系统下面安装了nodejs环境之后，执行npm install 很快成功了，于是我就把项目的开发环境转移到linux开发服务器下面去了，突然起了一个想法就是能不能使用docker来配置开发环境， 每一个项目都单独整一个开发运行环境来跑，抱着试试看的心态做了一下尝试， 发现成功了，现在把具体的操作进行一下记录，分享给同样爱原创 2022-04-08 14:12:56 · 2304 阅读 · 0 评论 -
19_vue中局部组件如何使用
1、什么是局部组件一般在单页面应用(SPA)中使用较多的是局部组件, 局部组件属于某一个具体Vue实例, 需要通过comopnents进行挂载。2、局部组件的定义语法const son = { template: 'id', // 组件名称 {Function | Object} [definition] // 组件参数}参数：{string} id // 组件名称{Fu...原创 2020-01-21 10:43:57 · 616 阅读 · 0 评论 -
18_vue中全局组件如何使用
1、什么是全局组件关于全局组件，大家不用想的太过于复杂，因为组件本身就是一个可重复使用的Vue实例对象，加上一个全局的修饰词，就是说可以在当前文件任意vue实例中使用的Vue实例对象，这个与任何编程语言中的全局变量与局部变量的概念是异曲同工的，纯属个人理解，不喜勿喷。2、全局组件的定义语法// 语法---Vue.component('组件名', {组件参数})Vue.component(...原创 2020-01-21 10:32:00 · 812 阅读 · 0 评论 -
17_vue中全局自定义指令directive的使用
1、 全局自定义指令如何定义Vue的设置全局自定义指令的方法如下：Vue.directive( '指令名称', { inserted: function(elem){回调函数需要执行的语句} })options说明：‘指令名称’ --自定义指令名称inserted --代表回调函数引用名称；function(elem){} --代表回调函数...原创 2019-11-21 08:19:51 · 553 阅读 · 0 评论 -
16_vue中私有自定义指令directives的使用
1、 私有自定义指令如何定义Vue的设置私有自定义指令的方法如下directives: {'指令名称': { inserted: function(elem){ }}options说明：‘指令名称’ --自定义指令名称inserted --代表回调函数引用名称；function(elem){} --代表回调函数；2、 私有自定义指令如何使...原创 2019-11-21 08:13:40 · 469 阅读 · 0 评论 -
15_vue私有过滤器filters的使用
1、私有过滤器filter如何定义通过Vue的过滤器方法Vue.filter('过滤器名', function(args){})进行定义定义私有过滤器的语法如下：new Vue({ el: '.app', data: {}, filters: { 'chgLowerCase': function(val){ return val.toLowerCase(); ...原创 2019-10-31 15:59:03 · 518 阅读 · 0 评论 -
14_vue全局过滤器filter的使用
1、全局过滤器filter如何定义通过Vue的过滤器方法Vue.filter('过滤器名', function(args){})进行定义定义全局过滤器的语法如下：Vue.filter('filter_name', function(args){ })2、如何调用全局过滤器filter定义成功后，在需要使用的地方(过滤变量)使用{{ user|toLowerCase }}进行调用...原创 2019-10-31 15:47:08 · 480 阅读 · 0 评论 -
13_vue属性ref操作DOM元素
1、ref的作用1）ref 被用来给元素或子组件注册引用信息。引用信息将会注册在父组件的 $refs 对象上。2）如果在普通的 DOM 元素上使用，引用指向的就是 DOM 元素；如果用在子组件上，引用就指向组件实例。3）当 v-for 用于元素或组件的时候，引用信息将是包含 DOM 节点或组件实例的数组。2、实例代码演示<!DOCTYPE html><html lan...原创 2019-10-28 10:10:04 · 1244 阅读 · 0 评论 -
12_vue侦听器watch
1、vue侦听器的作用监听data里的数据的变化情况,watch在初始化绑定的时候不会执行，等到改变之后才会去侦听计算; 如果在侦听器中增加immediate:true属性,初始化绑定的时候就会执行。2、实例代码演示<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> ...原创 2019-10-28 09:53:46 · 157 阅读 · 0 评论 -
11_vue计算属性computed
1、vue计算属性computed的作用computed中的属性对应的方法如果被重复调用的话，只会执行第一次，其他的调用都直接获取结果，节省内存，提高性能；2、实例代码演示<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Document&...原创 2019-10-28 09:36:43 · 415 阅读 · 0 评论 -
10_Vue指令篇之单次渲染DOM元素或者组件_v-once指令
1、v-once指令作用只渲染元素和组件一次。随后的重新渲染，元素/组件及其所有的子节点将被视为静态内容并跳过。这可以用于优化更新性能。2、代码实例<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>10_vue中单次渲染DOM元素或者组件_...原创 2019-10-28 09:13:01 · 724 阅读 · 0 评论 -
09_Vue指令篇之加载完成前隐藏模板语法_v-cloak指令
1、v-cloak的作用如果vue组件的渲染是在一个定时任务中执行，很容易出现之间将模板语法之类的字符串例如{{text}}直接解析到页面进行，解决这类问题只需要在需要在数据加载完成之后才显示的DOM中国添加v-cloak指令，同时在style样式中增加[v-cloak] {display:none;}即可；2、代码实例<!DOCTYPE html><html lang=...原创 2019-10-28 09:10:21 · 1305 阅读 · 0 评论 -
01-Vue框架的安装
（一）Vue框架的安装1.1 常用的几种vue安装方式介绍方式一：通过官方网站：https://cn.vuejs.org/v2/guide/installation.html 下载，使用script标签引入即可方式二：通过cdn提供的链接地址直接引入(可以连接网络的时候才可以使用)对于生产环境，我们需要链接到一个明确的版本号和构建文件，以避免新版本造成的不可预期的破坏：<scri...原创 2019-08-20 17:06:21 · 149 阅读 · 0 评论 -
02-Vue生命周期图示
Vue生命周期图示如下：原创 2019-09-18 10:39:48 · 149 阅读 · 0 评论 -
07_Vue指令篇之双向数据绑定_v-model指令
双向数据绑定_v-model指令1、主要作用主要作用：从后台获取数据展示到页面表单的输入区域，或者是将页面的输入数据传递到后台进行处理。2、使用范围*作用范围：v-model一般只用于表单输入、select和textarea这几种DOM元素。input输入框select下拉框textarea文本输入框注意：除了以上三种DOM元素，对于其他的DOM元素而言，v-model基本上是不...原创 2019-10-11 08:33:08 · 224 阅读 · 0 评论 -
06_Vue指令篇之元素类/属性绑定指令
1、v-bind主要作用：给元素绑定或者移class，或者绑定一个或者多个属性2、实例演示<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>03_vue指令绑定属性和类_v-bind</title></head>...原创 2019-09-18 15:09:22 · 1248 阅读 · 0 评论 -
08_Vue指令篇之DOM元素事件绑定_v-on指令
1、主要作用主要作用： 给DOM元素绑定事件。（v-on:事件名称 = “事件执行和函数引用”）2、简写方法简写方法： 事件绑定简写：@事件名称 = “事件执行和函数引用”。3、常用事件修饰符.stop - 调用 event.stopPropagation()。.prevent - 调用 event.preventDefault()。.capture - 添加事件侦听器时使用 ca...原创 2019-10-11 08:44:29 · 1286 阅读 · 0 评论 -
04_Vue模板语法-插值
1、什么是插值（插值表达式）在 html元素中使用{{}}获取实例对象对象中 data 的属性值,这种使用 {{}} 获取值得方式，叫做 插值 或 插值表达式 。2、插值使用实例演示<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>...原创 2019-09-18 11:29:59 · 387 阅读 · 0 评论 -
03_Vue 实例对象
1、vue的引入方式两种方式方式一 下载vue.js源文件，使用script标签引入<script src="./vue.js"></script>方式二 CDN服务提供的联网引入，前提是你的开发环境可以接入外网<script src="https://cdn.jsdelivr.net/npm/vue@2.5.16/dist/vue.js"><...原创 2019-09-18 11:18:20 · 271 阅读 · 0 评论 -
05_Vue指令篇之文本内容指令
1 v-text 纯文本指令主要作用：替换元素内的内容1.1 v-text 实例演示<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>01_vue指令文本内容_v-text</title></head><...原创 2019-09-18 12:07:49 · 748 阅读 · 0 评论