摘要: vue组件化初体验 全局组件和局部组件vue组件化 全局组件 局部组件 关于vue入门案例请参阅https://www.cnblogs.com/singledogpro/p/11938222.html 下载vuejs,Hello Vue(vscode)先看看目录结构,这里的vue.js脚本存放在src文件夹下,所以如果你参照上面的vue入门,记得把vue.js引用的地方也要修改下目录结构vue... 阅读全文
posted @ 2019-12-17 15:43 明奴 阅读(683) 评论(0) 推荐(0) 编辑
摘要: vue指令之v-cloak一起学 vue指令 v-cloak 指令可看作标签属性某些情况下可能由于机器性能故障或者网络原因,导致传输有问题,那么浏览器无法成功解析数据,此时浏览器输出的内容就是纯文本,这样会非常影响客户体验,干脆就不显示。此时我们可以使用v-cloak指令。该指令不常用。v-cloak指令:当数据未解析完成时会渲染什么样式。例如不显示。定义v-cloak样式然后给容器添加v-... 阅读全文
posted @ 2019-12-15 16:29 明奴 阅读(1746) 评论(0) 推荐(1) 编辑
摘要: 一起学vue指令之v-text一起学 vue指令 v-text 指令可看作标签属性v-text的功能和v-html很相似,都是在容器标签内控制字符串内容的输出,v-text输出纯文本,而v-html输出解析后的文本,该文本会覆盖掉原来的标签内容值。v-text和v-html功能类似,覆盖标签内容值如果是纯文本输出,那么输出的字符串结果和插值输出【mustache】一样。插值输出和v-text... 阅读全文
posted @ 2019-12-15 16:25 明奴 阅读(1236) 评论(0) 推荐(0) 编辑
摘要: 一起学vue指令之v-bind一起学 vue指令 v-bind 网页的图片url地址并不是固定写死的,如果写死,每一个活动就改一次图片的url,一个网页有多少张图片,工作量多大?通常来说,客户端向服务器发送请求,服务器返回url数据到vue实例的data数据中,由于url动态绑定了vue实例的data,所以会实时更新图片.无需我们手工更改,并且不会出错。有的同学说,直接用插值语法不就行了?插值语... 阅读全文
posted @ 2019-12-15 16:21 明奴 阅读(351) 评论(0) 推荐(0) 编辑
摘要: 一起学vue指令之v-pre一起学 vue指令 v-pre 指令可看作标签属性浏览器解析引擎遇到vue的插值符号时会自动解析,当你想输出不被解析的纯文本时,可以使用v-pre指令。未使用v-pre指令之前,data数据保存着message的值hello world,当启动浏览器时,输出Hello World,i am vue..未使用v-pre使用v-pre指令之后,输出纯文本值{{mess... 阅读全文
posted @ 2019-12-15 16:20 明奴 阅读(5951) 评论(0) 推荐(1) 编辑
摘要: 一起学vue指令之v-html一起学 vue指令 v-html 指令可看作标签属性某些情况下,我们点击百度搜索下一页,服务器应该就返回下一页的数据页面,包含其他资源链接等。返回的数据的本质是一个含HTML代码的字符串。以百度链接为例,如果是链接,它的形式是 百度一下如果我们直接通过{{}}插值输出,由于没有解析,就直接输出包含HTML的字符串,这肯定不符合需求的未使用v-html我们希望它先... 阅读全文
posted @ 2019-12-15 16:18 明奴 阅读(740) 评论(0) 推荐(0) 编辑
摘要: 一起学vue指令之v-once一起学 vue指令 v-once 指令可看作标签属性v-once口该指令后面不需要跟任何表达式(v-for后面接表达式)口该指令表示元素和组件只渲染一次,不会随着数据的改变而改变。未使用v-once指令之前,对数据进行修改,界面同步更新未使用v-once指令之前对容器使用v-once指令进行修饰之后,对数据进行修改,界面不更新使用v-once指令之后 阅读全文
posted @ 2019-12-15 16:17 明奴 阅读(3187) 评论(0) 推荐(0) 编辑
摘要: webpack插件之webpack-dev-serverwebpack插件 自动化 webpack-dev-server 现在只需要使用 npm run build指令就可以自动打包,并自动处理好各种依赖关系,但还是存在一个问题,如果对js文件的代码进行了修改,又要重新打包才能测试,很明显又要手动操作在开发测试过程中,我们会经常修改代码后,然后频繁刷新页面查看效果.对于我们前端仔来说,每次修改代... 阅读全文
posted @ 2019-12-12 17:44 明奴 阅读(1074) 评论(0) 推荐(0) 编辑
摘要: webpack插件之htmlWebpackPluginwebpack插件 自动化 htmlWebpackPlugin 由于webpack已经帮我们处理好js之间的依赖关系,现在我们可以忽略js的加载顺序,而只要在index.html内使用标签引入bundle.js即可。在index.html内使用引入bundle.js开发阶段,index.html在根目录,script引入好像也没什么问题。in... 阅读全文
posted @ 2019-12-12 17:37 明奴 阅读(2474) 评论(0) 推荐(0) 编辑
摘要: webpack配置之webpack.config.js文件配置webpack.config.js webpack resolve 1.总是手动的输入webpack的输入输出文件路径,是一件非常繁琐的事情。我们尝试用文件的形式将输入输出文件夹配置好。新建一个js文件,并命名为webpack.config.js【目前只能命名为这个,不然程序不识别】webpack.config.js2.在webpac... 阅读全文
posted @ 2019-12-12 17:34 明奴 阅读(18769) 评论(0) 推荐(1) 编辑