![](https://img-blog.csdnimg.cn/20201014180756919.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
vusjs
得做有氧
菜鸟在努力
展开
-
使用npm安装webpack和webpack-cli遇见的坑
刚开始学校vue.js所以开始有些懵,不知道什么webpack,什么是webpack-cli。其实这些都不重要 ,重要的是要理解什么是npm,cnpm。这东西俗称脚手架,其实就是帮助咱们安装所需要的东西。比如我要安装webpacknpm install webpack -g但是我一开始使用这个指令的时候要么不下载,要么卡死,要么报错。第一:如果报错的话,多半是node.js的问题,卸载node.js的时候一定要清空缓存。(…/nodejs/node_cache把这里面的东西清楚掉同时把安装失败的原创 2020-12-01 21:32:22 · 6844 阅读 · 5 评论 -
vue init webpack demo初始化项目的时候一直下载不动
vue init webpack demo初始化项目的时候一直下载不动在网上找了很多的方法,降低版本,更新版本也不行,之后用淘宝镜像下载也不行。后来在网上找到了这么一个设置 ,竟然好了。npm config set chromedriver_cdnurl https://npm.taobao.org/mirrors/chromedriver...原创 2020-11-30 22:51:06 · 415 阅读 · 2 评论 -
关于webpack执行npm run dev无法访问8080的问题
/** * Created by Administrator on 2020/5/28. */const webpack = require('webpack')const HtmlWebpackPlugin = require('html-webpack-plugin')//const UglifyjsWebpackPlugin = require('uglifyjs-webpack-plugin')const path = require('path')module.exports = {原创 2020-06-02 22:57:44 · 916 阅读 · 0 评论 -
关于webpack的简单配置问题
webpack.config.js/** * Created by Administrator on 2020/5/28. */const path = require('path')module.exports = { entry: './src/main.js', output: { path: path.resolve(__dirname,'dist'), filename: 'bundle.js' }, module: {原创 2020-05-31 21:43:02 · 113 阅读 · 0 评论 -
vue之slot作用域简单代码展示
<div id="app"> <cpn1></cpn1> <cpn1> <template slot-scope="slot"> //3.使用 slot-scope 来引用到模板指向的那个对象也就是这个数组 <slot > <span v-for="item in slot.data.join('-')">{{item}}</span&原创 2020-05-25 21:37:11 · 147 阅读 · 0 评论 -
vue中通过$$children和$refs父访问子组件中的属性
<div id="app"> <cpn1 ref="aaa"></cpn1> <button @click="btnClick"></button></div><template id="cpn1"> <div> 我是子组件 </div></template><script> const app原创 2020-05-20 23:15:36 · 246 阅读 · 0 评论 -
vue子组件向父组件传值的问题
<div id="app"> <cpn1 @chuansong="cpnClick"></cpn1> <!--在父组件中绑定点击事件,这里绑定的是自定义事件,名字要是 @子方法名字 = "父方法名字"--></div><template id="cpn1"> <!--<h1 >{{one}}</h1>--> <div> <!--原创 2020-05-20 21:14:20 · 263 阅读 · 0 评论 -
vue父组件向子组件传值
先上代码<div id="app"> <cpn1 :one = "hobbies"></cpn1></div><template id="cpn1"> <!--<h1 >{{one}}</h1>--> <ul> <li v-for="item in one">{{item}}</li> </ul><原创 2020-05-19 22:10:44 · 191 阅读 · 0 评论 -
基金涨跌简单模拟0.01
<div id="app"> <h2 >本金是{{money}}</h2> <button type="button" id = "in" v-on:click="inMoney">in</button> <button type="button" id = "out" v-on:click="outMoney">out</button></div><script>原创 2020-05-18 21:38:18 · 312 阅读 · 0 评论 -
vue之创建父子组件
我认为就是父子调用,如果会一门语言的话就比较好理解。理解为作用域,父可以调用子的组件。爷爷可以调用父组件,但是如果想要爷爷组件成功调用孙组件,必须在爷爷组件内都注册一遍。否则会报错。<div id="app"> <cpn2></cpn2> <cpn1></cpn1></div><script> //先创建子组件 const cpnC1 = Vue.extend({原创 2020-05-18 21:04:32 · 604 阅读 · 0 评论 -
vue的组件构造器的使用
我个人的理解就是直接代码复用,比如是common.js 一个意思都是代码复用<div id="app"> <my-cpn></my-cpn></div><script>//组件构造器 const cpnC = Vue.extend({ template:` <div > <h2>您的爱好是:</h2>原创 2020-05-17 23:00:02 · 435 阅读 · 0 评论 -
vue里面v-model对radio/select/checkbox双向绑定的使用
首先是checkbox,单选的<div id="app"> <input type="checkbox" v-model="message">checkSome <h2>选了么:{{message}}</h2></div><script> const app = new Vue({ el: '#app', data: { message:false原创 2020-05-14 22:21:54 · 526 阅读 · 0 评论 -
Vue中对数组的操作
<div id="app"> <ul> <li v-for="item in message" :key="item">{{item}}</li> </ul> <button @click="btnClick" >test</button></div><script> const app = new Vue({ el: '#ap原创 2020-05-13 20:45:21 · 769 阅读 · 0 评论 -
vue的v-if和v-else
jq中的判断放在vue中可以这样写,加上key是为了value不被复用(自己按照视频学习的记录练习)<div id="app"> <span v-if="ishow"> <label for="username">username</label> <input type="text" id ="username" placeholder = "username" key="username">原创 2020-05-12 21:26:20 · 276 阅读 · 0 评论 -
自学vuejs的练习,点击li让其绑定一个class
<head><meta charset="utf-8"><script src="https://unpkg.com/vue/dist/vue.js"></script></head><body> <style> .active{ color:red } </style><div id="app"> <ul> <li v-for="(m,index) i.原创 2020-05-10 13:19:17 · 140 阅读 · 0 评论