分类：vuejs

2020
10-10

Vue js with语句原理及用法解析

vue源码中编译部分有下面一段代码，里面用到了with：exportfunctiongenerate(ast:ASTElement|void,options:CompilerOptions):CodegenResult{conststate=newCodegenState(options)constcode=ast?genElement(ast,state):'_c("div")'return{render:`with(this){return$[code]}`,staticRenderFns:state.staticRenderFns}}下面详细解释一下with的用法：js中我们常用的一种类型是对象：letobj=... 继续阅读 >

2020
10-10

Vuejs通过拖动改变元素宽度实现自适应

需求：原理：拖动效果的实现基本都是dom操作来实现的，通过拖动分隔线，计算分隔线与浏览器边框的距离(left)，来实现拖动之后的不同宽度的计算；当拖动分隔线1时，计算元素框left和mid；当拖动分隔线2时，计算元素框mid和right；同时设置元素框最小值以防止元素框拖没了（其实是被遮住了）。使用SetCapture()和ReleaseCapture()的函数功能指定窗口里设置鼠标捕获。html部分代码：<template><div><ulclass="box"ref="box"><l... 继续阅读 >

2020
10-08

通过实例解析vuejs如何实现调试代码

基于webpack的配置调试使用Vue-cli命令行工具初始化基于wabpack模板的项目的命令语法：npminstall-g@vue/cli#全局安装vue-cli,版本vue3.xvueinitwebpack[my-project][app-name]#使用vue-cli初始化一个完整的webpack项目。cdmy-project#进入目录npminstall#安装依赖(package.json)npmstart#启动开发环境版本在config/index.js文件中更改devtool配置为sourc... 继续阅读 >

2020
09-28

webpack+vue.js构建前端工程化的详细教程

本篇主要介绍三块知识点：node.js,vue.js,webpack前端工程化，希望对您能有所帮助。本文来自于csdn,由火龙果软件Alice编辑推荐。node.js基本入门node.js介绍node.js可以让javascript程序在后端运行起来。我们之前所熟知的javascript都是运行在前端浏览器，我们编写好了javascript代码后，由浏览器解释执行。而node.js，可以让我们编写javascript，然后在后端运行起来。现在的javascript和java、python一样，可以操作I/O、操作数... 继续阅读 >

2020
09-23

Vue自定义组件的四种方式示例详解

四种组件定义方式都存在以下共性(血泪史)规则：1.组件只能有一个根标签2.记住两个词全局和局部3.组件名称命名中‘-小写字母'相当于大写英文字母(hello-com相当于helloCom)而对于在HTML中自定义组件的时候有4种写法，不过也只是殊途同归，都是用template属性对应的只有一个根标签的HTML代码。1.全局组件定义方式示例：Vue.component("hello-component",{props:["message"],template:"<div><h1>组件定义之全局组件</h1><h4>{... 继续阅读 >