最新文章

vue面试题 · 面试题 ·

怎么给vue定义全局的方法?

1、通过prototype,这个非常方便。Vue.prototype[method]=method; 2、通过插件Vue.use(plugin); 3、通过mixin,Vue.mixin(mixins); 第一种:挂载到Vue的prototype上。把全局方法写到一个文件里面,然后for循环挂载到Vue的prototype上,缺点是调用这个方法的时候没有提示 Object.keys(tools).forEach(key => { ...
vue面试题 · 面试题 ·

在使用计算属性的时,函数名和data数据源中的数据可以同名吗?

不可以同名 要是同名也可以,但data会覆盖methods。并且本就不该同名,同名说明你命名不规范。然后解释为什么会覆盖,因为Props、methods、data、computed、watch都是在initState函数中被初始化的。初始化顺序就是我上面给出的顺序,本质上这些都是要挂载到this上面的,你如果重名的话,后面出现的属性自然而然会覆盖之...
vue面试题 · 面试题 ·

描述v-model语法糖实现方式

在vuejs 中,v-model 这个语法糖能够很方便的实现表单和数据之间的绑定。比如在input 的输入框中,视图能够实时呈现我们在输入框中输入的内容。 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale...
小案例 ·

Vue组件通信 – 子传父 emit

vue组件通信 – 子传父 先决条件是子组件需要有一个主动事件来触发 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <style>...
小案例 ·

Vue组件通信 – props

Vue – Porps 父传子数据通信 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> </head> <body> <div id="app"> ...
小案例 ·

Web Components 真正的浏览器组件

1. 简单的页面结构 index.html <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <script src="main.js"></script> </head> &l...
小案例 ·

Vue实现数据实时模糊搜索效果

Vue实现数据实时模糊搜索效果 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <style> [v-cloak] { display...
小案例 ·

webpack 配置忽略打包文件夹

第一步当然是下载依赖 npm install copy-webpack-plugin --save-dev 然后将插件添加到您的webpack配置中。例如: let path = require('path') const CopyWebpackPlugin = require('copy-webpack-plugin'); module.exports = { plugins: [ new CopyPlugin({ patterns: [ { from: path.resolve(__di...
小案例 ·

一个简单的原生javascript显示隐藏效果

html部分 <div class="downloadApp"> <a href="javascript:;" id="codeShow"> APP下载 </a> <div class="code" id="app_code_pic"> <img src="images/app_code_pic.png" alt=""> </div> </div> css部分 .downloadApp { position: relat...