随笔分类 - 前端
摘要：1 <!DOCTYPE html> 2 <html lang="en"> 3 4 <head> 5 <meta charset="UTF-8"> 6 <meta name="viewport" content="width=<device-width>, initial-scale=1.0"> 7
阅读全文
摘要：<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="wi
阅读全文
摘要：<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="wi
阅读全文
摘要：1.目的，因为在做前端开发的时候需要进行原生事件处理，以下代码是使用两个不同的点击事件来触发对应的内容 比如第一个是演示获取之前的按钮上的内容，第二个是获取事件属性 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <met
阅读全文
摘要：1.v-for使用，前面两个针对数组，后面针对对象 <div v-for="value in object" ></div> <div v-for="(value, key) in object"></div> <div v-for="(value, key, index) in object"><
阅读全文
摘要：1 <template> 2 /* 在页面上显示ress的内容 */ 3 <div>{{ ress }}</div> 4 </template> 5 6 <script> 7 /* Vue 是通过 webpack 实现的模块化，因此可以使用 import 来引入模块 */ 8 /* 引入CopyDa
阅读全文
摘要：1.我们首先还是来看看代码 查看我们的结果 首先我们来解释一下整体的思路： data的内容和v-model的就不用说了，双向绑定默认值，也可以在input输入框内修改值 v-model调用函数的方法如上诉内容一致，只是需要加一个小括号 然后计算的方式从函数中进行返回显示在页面 为什么要减去一个0呢，
阅读全文
摘要：1.格式 完整格式：v-bind:元素属性='xxx' 缩写格式：:元素属性='xxx' 在上一章节的基础上，我们增加了如下代码，imgUrl的地址是网上随便找的 然后我们看看效果 增加跳转链接 2.事件绑定，格式 完整写法：v-on:事件名称="事件处理函数名" 缩写：@事件名称="事件处理函数名
阅读全文
摘要：1.之前我们绑定的数据修改一个内容之后其它内容也跟着变化，但是有时候我们只想改一个地方，那么这个时候我们需要用到v-once 首先我们看看之前的代码内容 2.然后我们使用vue进行调试时改变一个内容后其它内容都随之跟着改变 3.查看效果 我们在F12调试页面中修改我们的内容再次查看效果 然后会发现我
阅读全文
摘要：1.v-model双向绑定的实现原理，类似java中改变常量原值，然后其余变量去指定的地址的时候拿到最新的 2.把需要改变视图的数据初始化到Vue中，然后再通过修改Vue中的数据，从而实现对视图的更新 比如用户修改view中的数据，然后通过DOM Listeners监听到了之后从而修改到model中
阅读全文
摘要：1.首先我们来看看目标 2.然后我们看看解决过程 3.keep-alive用法
阅读全文
摘要：1.首先我们先创建一个文件夹，然后使用code工具打开此文件夹，在页面上新增一个文件，文件下新增一个html文件 2.在页面上输入一个"!"，然后使用快捷键shift+enter，编写空白的脚本 如果没有下载全局的vue模块的话，需要在这里进行下载局部的 编写我们的代码，再来查看效果
阅读全文
摘要：1.VScode微软公司轻量级跨平台的开源软件 visual studio code安装 首先我们先下载VScode，地址：https://code.visualstudio.com/ 下载成功之后在自己的本地查看下载的exe的包 然后如果出现这个暂时先不用管 最后除去选择安装地址的地方需要改动一下
阅读全文
摘要：1.查看我们的代码编写 <!DOCTYPE html><html><head><meta charset="utf-8"><title></title><script src="F:\vue\vue.2.2.2.vue.min.js"></script></head><body> <div id="
阅读全文
摘要：1.首先我们进入前端项目的package.json所在的目录，然后在目录栏输入cmd，进入所在目录的终端 然后全部下载所有模块 查看本地已安装模式 查看已安装的模块版本，比如下图查看jQuery的版本 查看最新的jquery版本npm view jquery version 查看最新的jquery所
阅读全文
摘要：1.我们在进行全局下载模块的时候需要考虑是不是生产，测试环境 如下图操作 这里我们安装一下npm install eslint ，eslint前端代码规范模块
阅读全文
摘要：1.NPM 全称node package manager 可从NPM服务器下载别人编写好的第三方包到本地使用 可从NPM服务器下载并安装别人编写的命令行程序到本地使用 可以将自己编写的内容上传至NPM供别人使用 粗略的来讲NPM可以理解成前端的Maven 我们先下载node.js https://n
阅读全文
摘要：1.首先来编写原有脚本 2.来调用之后输出 备注：document.write()为输出函数，<br>为换行 3.查看效果
阅读全文
摘要：1.首先我们来查看一下原来代码 2.修改我们的代码，先在div中增加一个div，然后我们再来使用document.getElementById("myxiaotaozi").innerHTML来调用 3.展示结果
阅读全文
摘要：1.查看一下我们本身代码 <!DOCTYPE html><html><head><meta charset="utf-8"><title>Vue起步</title><script src="F:\vue\vue.2.2.2.vue.min.js"></script></head><body> <di
阅读全文
浙公网安备 33010602011771号