划空破云烟-CSDN博客

一、concat()连接两个或多个数组，并返回已连接数组的副本。// concat合并数组var array1 = ["S60", "S70"];var array2 = ["XC40", "XC50", "XC60"];var array3 = ["t140", "t250", "Xt360"];// 把数组 3个数组合并在一起// (方法不会更改现有数组，而是返回一个新数组)let newArray = array1.concat(array2,array3)console.

2022-03-20 21:51:32 1264

原创用git创建项目

vue 脚手架的使用1.创建项目npm create 项目名称2.git管理项目代码在git中创建项目2.创建仓库3.将本地代码和仓库进行连接在控制台输入上面两行代码git remote add origin https://github.com/caoruibin/shop.gitgit push -u origin master4.登录github （输入账号密码）5.完成之后3.目录划分4.将css引入1.将normalize 引入base.css2.

2021-04-06 19:07:20 287

原创 vue 基础 promise函数的使用

vue 基础 promise1.promise基本使用 <script> new Promise((resolve,reject)=>{ setTimeout(()=>{ //成功 //收到data后把 data传递到then那 resolve('hello world')

2021-03-30 00:58:51 846

原创 vue 基础作用域插槽的使用

vue 作用域插槽的使用 <div id="app"> <cpn></cpn> <cpn>  <template slot-scope="slot"> <!-- <span v-for="item in slot.data"

2021-03-20 02:39:06 243

原创 vue 基础具名插槽的使用

vue 具名插槽的使用 <div id="app"> <cpn><span slot="center">标题</span></cpn> <cpn><button slot="left">标题</button></cpn> </div> <template id=

2021-03-20 01:28:14 250

原创 vue 基础插槽的基本使用

vue 插槽的基本使用  <div id="app"> <cpn><button>按钮</but

2021-03-19 22:41:24 97

原创 vue 基础子访问父-parent-root

vue组件访问子访问父-parent-root <div id="app"> <cpn></cpn> </div> <template id="cpn"> <div> <h2>我是cpn组件</h2> <ccpn></ccpn>

2021-03-19 22:23:11 167

原创 vue 基础父访问子 children-refs

vue基础父访问子-children-refs <div id="app"> <cpn></cpn> <cpn></cpn> <cpn ref="aaa"></cpn> <button @click='btnClick'>按钮</button> </div> <template id="

2021-03-19 19:32:17 208

原创 vue 基础组件通信

vue 组件通信一、组件通信父传子 <div id="app"> <cpn :cmovies="movies" :cmessage="message"></cpn> </div> <template id="cpn"> <div> <ul> <li v-for="item in cmovies"> {{

2021-03-14 03:23:02 299

原创 vue 基础组件化的基本使用

vue 组件化一、vue组件化的基本使用 <div id="app">  <my-cpn></my-cpn> <my-cpn></my-cpn> <my-cpn></my-cpn> <my-cpn></my-cpn> </div> <scr

2021-03-14 02:29:31 154

原创 vue 基础 v-model 基本使用

vue 基础 v-model一、v-model的使用<div id="app"> <input type="text" v-model="message"> {{message}} </div> <script src="../js/vue.js"></script> <script> const app = new Vue({ el:

2021-03-14 01:37:21 440

原创 vue 基础常用的高阶函数

vue 中常用的高阶函数一、filter 过滤const nums = [10,20,30,40,666,980]//返回true 就把内容加到 newNums数组中 let newNums = nums.filter(function(n){ return n < 100})要求:1.n 为传递过来的每一个数2.返回小于 100 的（你小于100 才会返回）二、map函数//2.map函数的使用let new2Nums= newNums.map(func

2021-03-13 19:21:23 1127

原创 vue 基础案例：书籍购物车

vue 案例：书籍购物车一、HTML <div id="app"> <div v-if="books.length>0"> <table> <thead> <tr> <th></th> &lt

2021-03-13 19:08:15 507

原创 vue 基础循环变量 v-for

vue 基础循环遍历一、v-for遍历数组 <div id="app">  <ul> <li v-for='item in names'>{{item}}</li> </ul>  <ul> &lt

2021-03-13 17:48:51 2344

原创 vue 基础 v-if 和 v-show

vue 条件判断一、v-if的使用 <div id='app'> <h2 v-if="isShow"> <div>abc</div> <div>abc</div> <div>abc</div> <div>abc</div> <div&gt

2021-03-13 04:02:56 370

原创 vue 基础 v-on事件监听

vue基础事件监听一、v-on的基本使用 <div id='app'> <h2>{{counter}}</h2>   &l

2021-03-13 03:13:05 228

原创 vue 基础计算属性与 methods

vue 基础计算属性一、计算属性的基本使用 <div id="app"> <h2>{{fullName}}</h2> </div> <script src="../js/vue.js"></script> <script> const app = new Vue({ el:"#

2021-03-13 02:25:16 137

原创 vue 基础动态绑定属性 v-bind

vue 动态绑定属性一、v-bind1v-bind的指令使用 <div id="app">  <img :src="imgURL"> <a :href="ahref">百度</a> </div> <script src="../js/vue.js"></s

2021-03-12 23:33:06 504

原创 Vue 基础插值、指令

VUE 基础一、初体验（模板） <div id="app"> <h2>{{message}}</h2> <p>{{name}}</p> </div> <script src="../js/vue.js"></script> <script> //声明式编程 const app = new Vue({

2021-03-12 17:30:06 100

原创 jQuery 常见方法

1.jQuery获取标签导入 jQuery <div></div> <script src="./js/jquery-1.12.3.min.js"></script> <script> //$()获取标签 html()获取去元素 css() 添加样式 $('div').html('hello').css({ color:'red', fontSize:

2021-03-11 04:28:04 391

原创 JavaScript 基础样式的获取

1.计算样式 <style> #app{ font-size:40px; width: 200px; height: 200px; background-color: green; } </style> <div id="app" style="color: red;"> hello </div&

2021-03-11 03:55:55 220

原创 JavaScript 基础选项卡

1.选项卡 HTML <div id="app" class="app">  <div class="header"> <span class="choose">精选</span> <span>社会</span> <span&gt

2021-03-11 03:42:11 149

原创 JavaScript 基础对应与排它

1.对应与排它<div id="app1"> <p>item1</p> <p>item2</p> <p>item3</p> <p>item4</p> </div> <hr /> <div id="app2">

2021-03-11 03:30:04 123

原创 JavaScript 基础 DOM

1.DOM <h1 id=app>hello beng</h1> <script> var app = document.getElementById('app'); //获取标签 console.log(app); //修改内容 app.innerHTML="风铃" //获取内容 console.log(app.innerHTML);

2021-03-05 05:12:21 154 1

原创 JavaScript 基础正则

1.正则检测有没有两个 ll 连在一起的 //定义字符串 var str = 'hello feng'; // 正则：有没有两个连在一起的 ll //创建正则 var reg = /ll/; //首次匹配的结果以数组的形式输出 console.log(reg.exec(str)); // 检测字符串是否满足正则表达式符合 true 不符合false

2021-03-05 04:56:34 130 1

原创 JavaScript 基础字符串数字

1.数字保留2位小数 var a= 100; //保留2位小数 console.log(a.toFixed(2)); //类型是字符串 console.log(typeof a.toFixed(2));2.字符串获取字符串的长度 var str = 'hello feng' console.log(str.length); //通过索引值获取每一个字符从0开始

2021-03-05 03:48:07 195 1

原创 JavaScript 基础 this

1.this表示函数上下文的对象(调用者)只能在函内部使用全局的this 指向window2.全局变量 var color = 'red'; function demo(){ //全局定义的函数，this也指向window console.log('demo',this); } console.log(window.color); demo();3.对象中的方法（指向调

2021-03-05 03:28:32 163 1

原创 JavaScript 基础 json

1.json对象 var obj ={ color:'red', //属性名可以用引号包裹 //出现不合法的属性名称，可用用' car-num ' 包裹 'num':10, 'price':'100', size:{ width:200, height:100,

2021-03-05 03:12:12 231 1

原创 JavaScript 基础对象

1.对象 var car = { //属性来描述描述特征 color: "red", //方法来定义动作 run:function(){ console.log('汽车跑起来'); } } //获取属性 consol

2021-03-05 02:37:18 122 1

原创 JavaScript 基础数组

数组1.堆栈：最后一个元素后进先出2.队列：最后一个元素后进后出第一个新元素选出3.数组的方法末尾删除 var result = arr.pop() console.log(result,arr);末尾删除 var result = arr.push(10,20,30); console.log(result,arr);首位删除 va

2021-03-03 03:49:05 123

原创 JavaScript基础函数

JavaScript基础1 函数的定义式function demo (){ console.log('demo'); }2 函数表达式var feng = function(){ console.log('feng'); }3 简单类型赋值的是值（互相不影响） var a = 20; //变量a为变量 b赋值 var b = a; //修改b //简单类型赋值的是值， b = 30; console.log(a,b); //20 304

2021-03-01 02:14:55 187

原创 Github搜索案例

Github搜索案例1.布局App.jsSearchList把html 先放在 App.js中把 class 改成 classNamestyle 样式设置style={{width:'100px'}}样式放到 App.css中在public 中设一个文件css 引入 bootstrap.css在 index.html 中导入bootstrap<link rel="stylesheet" href="./css/bootst

2021-02-01 00:20:12 444

原创 React todoList 案例

React案例 todoList组件布局1.新建components 文件夹下进行组件化布局HeaderListItemFooterindex.jsxindex.css每一个进行 rcc 类组件布局先把Html 放到App.jsxcss 放到 App.css中2.在App.jsx 中的进行组件导入与 css (组件拆分好进行导入)导入导入导入Item 是List 的子组件3.index.js (入口文件)导入R

2021-01-26 16:31:54 696

空空如也

空空如也