2018.7.13vue知识小结

               //配置是否允许vue-devtools检查代码，方便调试，生产环境中需要设置为false
             Vue.config.devtools=false;
             Vue.config.productionTip=false; //阻止vue启动时生成生产消息

for循环

 <ul>
              普通循环
              <li v-for="value in arr">{{value}}</li>
              <li v-for="value in user">{{value}}</li> 
 
              键值循环
              <li v-for="(v,k) in arr">{{k}}={{v}}</li>
              <li v-for="(v,k) in user">{{k}}={{v}}</li> 
 
              可以直接循环包含重复数据的集合，可以通过指定:key属性绑定唯一key，当更新元素时可重用元素，提高效率，类似于vue1.0中track-by
              <li v-for="(v,k) in arr2" :key="k">{{v}}</li> 
 
             <li v-for="(user,index) in users">
                 {{index+1}},{{user.id}},{{user.name}},{{user.age}}
             </li>
         </ul>

通过表单给table添加行：

 <!DOCTYPE html>
 <html lang="en">
 <head>
     <meta charset="UTF-8">
     <title>练习：用户管理</title>
     <script src="js/vue.js"></script>
     <link rel="stylesheet" href="bootstrap/bootstrap.min.css">
     <script src="bootstrap/jquery.min.js"></script>
     <script src="bootstrap/bootstrap.min.js"></script>
 <body>
     <div class="contaienr">
         <h2 class="text-center">添加用户</h2>
         <form class="form-horizontal">
             <div class="form-group">
                 <label for="name" class="control-label col-sm-2 col-sm-offset-2">姓名</label>
                 <div class="col-sm-6">
                     <input class="form-control" id="name" placeholder="请输入姓名" v-model="user.name">
                 </div>
             </div>
             <div class="form-group">
                 <label for="age" class="control-label col-sm-2 col-sm-offset-2">年  龄：</label>
                 <div class="col-sm-6">
                     <input type="text" class="form-control" id="age" v-model="user.age" placeholder="请输入年龄">
                 </div>
             </div>
             <div class="form-group">
                 <label for="email" class="control-label col-sm-2 col-sm-offset-2">邮  箱：</label>
                 <div class="col-sm-6">
                     <input type="text" class="form-control" id="email" v-model="user.email" placeholder="请输入邮箱">
                 </div>
             </div>
             <div class="form-group text-center">
                 <input type="button" class="btn btn-primary" value="重置"  @click="addUser">
                 <input type="reset" class="btn btn-primary" value="添加" >
             </div>
         </form>
         <hr>
         <!--表格-->
         <table class="table table-bordered table-hover">
             <caption class="h3 text-center text-info">用户列表</caption>
             <thead>
             <tr>
                 <th class="text-center">序号</th>
                 <th class="text-center">姓名</th>
                 <th class="text-center">年龄</th>
                 <th class="text-center">邮箱</th>
                 <th class="text-center">操作</th>
             </tr>
             </thead>
             <tbody>
                <tr v-for="(user,index) in users" class="text-center">
                    <td>{{index+1}}</td>
                    <td>{{user.name}}</td>
                    <td>{{user.age}}</td>
                    <td>{{user.email}}</td>
                    <td>
                        <button class="btn btn-danger btn-sm" @click="nowIndex=index"  data-toggle="modal" data-target="#del">删除</button>
                    </td>
                </tr>
                <tr>
                    <td colspan="5" class="text-right">
                        <button class="btn btn-danger btn-sm" data-toggle="modal" data-target="#del" v-on:click="nowIndex=-1"  data-toggle="modal" data-target="#del">删除所有</button>
                    </td>
                </tr>
             </tbody>
         </table>
 
     <!-- 模态框，弹出框 -->
     <div class="modal fade" id="del">
         <div class="modal-dialog">
             <div class="modal-content">
                 <div class="modal-header">
                     <button class="close" data-dismiss="modal">
                         <span>&times;</span>
                     </button>
                     <h4 class="modal-title" v-show="nowIndex!==-1">确认要删除用户：{{users[nowIndex]?users[nowIndex].name:''}} 吗？</h4>
                     <h4 class="modal-title" v-show="nowIndex===-1">确认要删除所有用户吗？</h4>
                 </div>
                 <div class="modal-body text-center">
                     <button class="btn btn-primary" data-dismiss="modal">取消</button>
                     <button class="btn btn-primary" data-dismiss="modal" @click="deleteUser">确认</button>
                 </div>
             </div>
         </div>
     </div>
     </div>
 </body>
 </html>
 <script>
   let vm=new Vue({
       el:'.contaienr',
       data:{
           users:[
               {name:'tom',age:24,email:'tom@itany.com'},
               {name:'jack',age:23,email:'jack@sina.com'}
           ],
           user:{},
           nowIndex:-1,
       },
       methods:{
           addUser(){
             this.users.push(this.user)
             this.user={}
           },
           deleteUser(){
               if(this.nowIndex=-1){
                   this.users=[];
               }else{
                   this.users.splice(this.nowIndex,1); //从指定索引位置开始删除，删除一个
 
               }
           }
       }
   })
 </script>

自定义一个全局过滤器：

 <body>
     <div id="itany">
          <h3>{{3 | addZero}}</h3>
          <h3>{{30 | addZero}}</h3>
     </div>
 </body>
 </html>
 <script>
     Vue.filter('addZero',function(date){
         return date<10?'0'+date:date;
     })
     new Vue({
         el:'#itany',
         data:{
             date:'',
         }
     })
     //页面返回值：03||30
 </script>

自定义全局格式化日期的过滤器：

 <body>
     <div id="itany">
         <h3>{{date | date}}</h3>
     </div>
 </body>
 </html>
 <script>
     Vue.filter('date',function(date){
         let d=new Date(date)
         return  d.getFullYear()+'-'+(d.getMonth()+1)+'-'+d.getDate()+'  '+d.getHours()+':'+d.getMinutes()+':'+d.getSeconds();
         //2018-7-13 17:22:14
     })
     new Vue({
         el:'#itany',
         data:{
             date:Date.now(),
         }
     })
 </script>

自定义四舍五入局部过滤器：

 <body>
     <div id="itany">
         <h3>{{12.345678 | number(2)}}</h3>
     </div>
 </body>
 </html>
 <script>
 
     new Vue({
         el:'#itany',
         data:{
                 data:'',
         },
         filters:{
             number:(data,n)=>{
                 return data.toFixed(n)//12.35
             }
         }
     })
 </script>

讲义内容：

   + 是一个构建用户界面的框架
   + 是一个轻量级MVVM（Model-View-ViewModel）框架，和angular、react类似，其实就是所谓的数据双向绑定
   + 数据驱动+组件化的前端开发（核心思想）
   + 通过简单的API实现**响应式的数据绑定**和**组合的视图组件**
   + 更容易上手、小巧
 ## 二、起步
 ### 1. 下载核心库vue.js
     bower info vue
     npm init --yes
     cnpm install vue --save
     vue2.0和1.0相比，最大的变化就是引入了Virtual DOM（虚拟DOM）,页面更新效率更高，速度更快
 ### 2. Hello World（对比angular）
 #### 2.2 vue实现
     js:
         new Vue({
             el:'#itany', //指定关联的选择器
             data:{ //存储数据
                 msg:'Hello World',
                 name:'tom'
             }
         });
     html:
         <div id="itany">
             {{msg}}
         </div>
 
 ### 3. 安装vue-devtools插件，便于在chrome中调试vue
     直接将vue-devtools解压缩，然后将文件夹中的chrome拖放到扩展程序中
 
     //配置是否允许vue-devtools检查代码，方便调试，生产环境中需要设置为false
         Vue.config.devtools=false;
         Vue.config.productionTip=false; //阻止vue启动时生成生产消息
 
 ## 三、 常用指令
 ### 1. 什么是指令？
     用来扩展html标签的功能
 ### 2. vue中常用的指令
   + v-model
     双向数据绑定，一般用于表单元素
   + v-for
     对数组或对象进行循环操作，使用的是v-for，不是v-repeat
     注：在vue1.0中提供了隐式变量，如$index、$key
         在vue2.0中去除了隐式变量，已被废除
   + v-on
     用来绑定事件，用法：v-on:事件="函数"
   + v-show/v-if
     用来显示或隐藏元素，v-show是通过display实现，v-if是每次删除后再重新创建，与angular中类似
 ## 五、 事件和属性
 ### 1. 事件
 #### 1.1 事件简写
     v-on:click=""
     简写方式 @click=""
 #### 1.2 事件对象$event
     包含事件相关信息，如事件源、事件类型、偏移量
     target、type、offsetx
 #### 1.3 事件冒泡
     阻止事件冒泡：
         a)原生js方式，依赖于事件对象
         b)vue方式，不依赖于事件对象
             @click.stop
 #### 1.4 事件默认行为
     阻止默认行为：
         a)原生js方式，依赖于事件对象
 #### 1.5 键盘事件
     回车：@keydown.13 或@keydown.enter
     上：@keydown.38 或@keydown.up
     默认没有@keydown.a/b/c...事件，可以自定义键盘事件，也称为自定义键码或自定义键位别名
 #### 1.6 事件修饰符
     .stop - 调用 event.stopPropagation()。
     .prevent - 调用 event.preventDefault()。
     .{keyCode | keyAlias} - 只当事件是从特定键触发时才触发回调。
     .native - 监听组件根元素的原生事件。
     .once - 只触发一次回调。
 ### 2. 属性
 #### 2.1 属性绑定和属性的简写
     v-bind 用于属性绑定， v-bind:属性=""
     属性的简写：
         v-bind:src="" 简写为 :src=""
 #### 2.2 class和style属性
     绑定class和style属性时语法比较复杂：
 ## 六、 模板
 ### 1. 简介
     Vue.js使用基于HTML的模板语法，可以将DOM绑定到Vue实例中的数据
     模板就是{{}}，用来进行数据绑定，显示在页面中
     也称为Mustache语法
 ### 2. 数据绑定的方式
     a.双向绑定
         v-model
     b.单向绑定
         方式1：使用两对大括号{{}}，可能会出现闪烁的问题，可以使用v-cloak解决
         方式2：使用v-text、v-html
 ### 3. 其他指令
     v-once 数据只绑定一次
     v-pre 不编译，直接原样显示
 ## 七、 过滤器
 ### 1. 简介
     用来过滤模型数据，在显示之前进行数据处理和筛选
     语法：{{ data | filter1(参数) | filter2(参数)}}
 ### 2. 关于内置过滤器
     vue1.0中内置许多过滤器，如：
         currency、uppercase、lowercase
         limitBy
         orderBy
         filterBy
     vue2.0中已经删除了所有内置过滤器，全部被废除
     如何解决：
         a.使用第三方工具库，如lodash、date-fns日期格式化、accounting.js货币格式化等
         b.使用自定义过滤器

各种请求封装：

                 methods:{
                     send(){
                         axios({
                             method:'get',
                             url:'user.jsonaaa'
                         }).then(function(resp){
                             console.log(resp.data);
                         }).catch(resp => {
                             // console.log(resp);
                             console.log('请求失败：'+resp.status+','+resp.statusText);
                         });
                     },
                     sendGet(){
                         // axios.get('server.php?name=tom&age=23')
                         axios.get('server.php',{
                             params:{
                                 name:'alice',
                                 age:19
                             }
                         })
                         .then(resp => {
                             console.log(resp.data);
                         }).catch(err => {
                             console.log('请求失败：'+err.status+','+err.statusText);
                         });
                     },
                     sendPost(){//post请求传参数的时候，需要改变样式；
                         // axios.post('server.php',{
                         //         name:'alice',
                         //         age:19
                         // })
                         // axios.post('server.php','name=alice&age=20&') //方式1
                         axios.post('server.php',this.user,{
                             transformRequest:[
                                 function(data){
                                     let params='';
                                     for(let index in data){
                                         params+=index+'='+data[index]+'&';
                                     }
                                     return params;
                                 }
                             ]
                         })
                         .then(resp => {
                             console.log(resp.data);
                         }).catch(err => {
                             console.log('请求失败：'+err.status+','+err.statusText);
                         });
                     },
                     getUserById(uid){
                         axios.get(`https://api.github.com/users/${uid}`)
                         .then(resp => {
                             // console.log(resp.data);
                             this.user=resp.data;
                         });
                     },
                     sendJSONP(){
                         //https://sug.so.360.cn/suggest?callback=suggest_so&encodein=utf-8&encodeout=utf-8&format=json&fields=word&word=a
                         this.$http.jsonp('https://sug.so.360.cn/suggest',{
                             params:{
                                 word:'a'
                             }
                         }).then(resp => {
                             console.log(resp.data.s);
                         });
                     },
                     sendJSONP2(){
                         //https://sp0.baidu.com/5a1Fazu8AA54nxGko9WTAnF6hhy/su?wd=a&json=1&p=3&sid=1420_21118_17001_21931_23632_22072&req=2&csor=1&cb=jQuery110208075694879886905_1498805938134&_=1498805938138
                         this.$http.jsonp('https://sp0.baidu.com/5a1Fazu8AA54nxGko9WTAnF6hhy/su',{
                             params:{
                                 wd:'a'
                             },
                             jsonp:'cb' //百度使用的jsonp参数名为cb，所以需要修改
                         }).then(resp => {
                             console.log(resp.data.s);
                         });
                     }
                 }

组件的生命周期：

     beforeCreate(){
                     alert('组件实例刚刚创建，还未进行数据观测和事件配置');
                 },
                 created(){  //常用！！！
                     alert('实例已经创建完成，并且已经进行数据观测和事件配置');
                 },
                 beforeMount(){
                     alert('模板编译之前，还没挂载');
                 },
                 mounted(){ //常用！！！
                     alert('模板编译之后，已经挂载，此时才会渲染页面，才能看到页面上数据的展示');
                 },
                 beforeUpdate(){
                     alert('组件更新之前');
                 },
                 updated(){
                     alert('组件更新之后');
                 },
                 beforeDestroy(){
                     alert('组件销毁之前');
                 },
                 destroyed(){
                     alert('组件销毁之后');
                 }

vue的属性：

     /*var vm=new Vue({
             // el:'#itany',
             data:{
                 msg:'welcome to itany'
             },
             name:'tom',
             age:24,
             show:function(){
                 console.log('show');
             }
         });*/
 
         /**
          * 属性
          */
         //vm.属性名 获取data中的属性
         // console.log(vm.msg);
 
         //vm.$el 获取vue实例关联的元素
         // console.log(vm.$el); //DOM对象
         // vm.$el.style.color='red';
 
         //vm.$data //获取数据对象data
         // console.log(vm.$data);
         // console.log(vm.$data.msg);
 
         //vm.$options //获取自定义属性
         // console.log(vm.$options.name);
         // console.log(vm.$options.age);
         // vm.$options.show();
 
         //vm.$refs 获取所有添加ref属性的元素
         // console.log(vm.$refs);
         // console.log(vm.$refs.hello); //DOM对象
         // vm.$refs.hello.style.color='blue';

　　　　　　// this.$set(this.user,'age',18); //通过vue实例的$set方法为对象添加属性，可以实时监视

　　　局部属性watch:

         watch:{ //方式2：使用vue实例提供的watch选项
                 age:(newValue,oldValue) => {
                     console.log('age被修改啦，原值：'+oldValue+'，新值：'+newValue);
                 },
                 user:{
                     handler:(newValue,oldValue) => {
                         console.log('user被修改啦，原值：'+oldValue.name+'，新值：'+newValue.name);
                     },
                     deep:true //深度监视，当对象中的属性发生变化时也会监视
                 }
             }

全局watch:

     //方式1：使用vue实例提供的$watch()方法
         vm.$watch('name',function(newValue,oldValue){
             console.log('name被修改啦，原值：'+oldValue+'，新值：'+newValue);
         });

父子组件之间的数据传递：

<body>
    <div id="itany">
        <my-hello></my-hello>
    </div>
    <template id="hello">
        <div>
            <h3>我是hello父组件</h3>
            <h3>访问自己的数据：{{msg}},{{name}},{{age}},{{user.username}}</h3>
            <h3>访问子组件的数据：{{sex}},{{height}}</h3>
            <hr>
            <my-world :message="msg" :name="name" :age="age" @e-world="getData"></my-world>
        </div>
    </template>
    <template id="world">
        <div>
            <h4>我是world子组件</h4>
            <h4>访问父组件中的数据：{{message}},{{name}},{{age}},{{user.username}}</h4>
            <h4>访问自己的数据：{{sex}},{{height}}</h4>
            <button @click="send">将子组件的数据向上传递给父组件</button>
        </div>
    </template>
    <script>
        var vm=new Vue({ //根组件
            el:'#itany',
            components:{
                'my-hello':{  //父组件
                    methods:{
                        getData(sex,height){
                            this.sex=sex;
                            this.height=height;
                        }
                    },
                    data(){
                        return {
                            msg:'网博',
                            name:'tom',
                            age:23,
                            user:{id:9527,username:'唐伯虎'},
                            sex:'',
                            height:''
                        }
                    },
                    template:'#hello',
                    components:{
                        'my-world':{ //子组件
                            data(){
                                return {
                                    sex:'male',
                                    height:180.5
                                }
                            },
                            template:'#world',
                            // props:['message','name','age','user'] //简单的字符串数组
                            props:{ //也可以是对象，允许配置高级设置，如类型判断、数据校验、设置默认值
                                message:String,
                                name:{
                                    type:String,
                                    required:true
                                },
                                age:{
                                    type:Number,
                                    default:18,
                                    validator:function(value){
                                        return value>=0;
                                    }
                                },
                                user:{
                                    type:Object,
                                    default:function(){ //对象或数组的默认值必须使用函数的形式来返回
                                        return {id:3306,username:'秋香'};
                                    }
                                }
                            },
                            methods:{
                                send(){
                                    // console.log(this);  //此处的this表示当前子组件实例
                                    this.$emit('e-world',this.sex,this.height); //使用$emit()触发一个事件，发送数据
                                }
                            }
                        }
                    }
                }
            }
        });
    </script>
</body>

reduce()方法：

 array.reduce(function(total, currentValue, currentIndex, arr), initialValue) function(total,currentValue, index,arr)    必需。用于执行每个数组元素的函数。 total    必需。初始值, 或者计算结束后的返回值。
 currentValue    必需。当前元素
 currentIndex    可选。当前元素的索引
 arr    可选。当前元素所属的数组对象。
 initialValue    可选。传递给函数的初始值

购物车代码：

 <body>
     <div id="app" class="container">
         <h2 class="text-center">购物车</h2>
         <table class="table table-bordered table-hover table-condensed">
             <thead>
             <tr>
                 <th class="text-center">商品编号</th>
                 <th class="text-center">商品名称</th>
                 <th class="text-center">购买数量</th>
                 <th class="text-center">商品单价</th>
                 <th class="text-center">商品总价</th>
                 <th class="text-center">操作</th>
             </tr>
             </thead>
             <tbody>
             <tr v-for="(item,index) in commodities" class="text-center">
                 <td>{{item.id}}</td>
                 <td>{{item.name}}</td>
                 <td>
                     <button class="btn btn-primary" @click="subtract(index)">-</button>
                     <input type="text" v-model="item.quantity">
                     <button class="btn btn-primary" @click="add(index)">+</button>
                 </td>
                 <td>{{item.price | filterMoney}}</td>
                 <td>{{item.price*item.quantity | filterMoney}}</td>
                 <td>
                     <button class="btn btn-danger" @click="remove(index)">移除</button>
                 </td>
             </tr>
             <tr>
                 <td colspan="2">总数量：{{totalNum}}</td>
                 <td colspan="2">总金额：{{totalMoney | filterMoney}}</td>
                 <td colspan="2">
                     <button class="btn btn-danger" @click="empty()">清空购物车</button>
                 </td>
             </tr>
             <tr v-show="commodities.length===0">
                 <td colspan="6" class="text-center text-muted">
                     <p>您的购物车空空如也....</p>
                 </td>
             </tr>
             </tbody>
         </table>
     </div>
     <script src="js/vue.js"></script>
     <script>
             new Vue({
                 el:'#app',
                 data:{
                     commodities: [
                         {id: 1001,name: 'iphone5s',quantity: 3,price: 4000},
                         {id: 1005,name: 'iphone6',quantity: 9,price: 5000},
                         {id: 2001,name: 'imac',quantity: 4,price: 7000},
                         {id: 2004,name: 'ipad',quantity: 5,price: 2000}
                     ]
                 },
                 computed:{
                     totalNun:function(){
                         var sum=0;
                         this.commodities.forEach(function(item){
                             sum_=item.quantity;
                         })
                         return sum;
                     },
                     totalMoney:function(){
                         return this.commodities.reduce(function(pre,cur,index,array){
                             return pre+cur.price*cur.quantity
                         },0)
                     },
                 },
                 filters:{
                     filterMoney:function(value){
                         return '$'+value;
                     }
                 },
                 methods:{
                     add:function(index){
                         this.commodities[index].quantity++
                     },
                     substract:function(index){
                         var item=this.commodies[index];
                         if(item.quantity==1){
                             if(confirm(`确定要删除商品：${item.name} 吗？`)){
                                 this.commodities.aplice(index,1);
                             }
                             return;
                         }
                         item.quantity--;
                     },
                     remove:function(index){
                         if (confirm(`确定要删除商品：${this.commodities[index].name} 吗？`)) {
                             this.commodities.splice(index, 1)
                         }
                     },
                     empty:function(){
                         this.commodities=[];
                     }
                 }
             })
     </script>
 </body>

2018.7.13vue知识小结的更多相关文章

Android app开发知识小结
Android知识小结这是一个知识的总结,所以没有详解的讲解. 一.分辨率Android中dp长度.sp字体使用.px像素.in英寸.pt英寸1/72.mm毫米了解dp首先要知道density,d ...
C/C++ 位域知识小结
C/C++ 位域知识小结几篇较全面的位域相关的文章: http://www.uplook.cn/blog/9/93362/ C/C++位域(Bit-fields)之我见 C中的位域与大小端问题内存 ...
JAVA 变量数据类型运算符知识小结
---------------------------------------------------> JAVA 变量数据类型运算符知识小结 <------------------ ...
html5-基本知识小结及补充
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8&qu ...
HTTPS知识小结
HTTPS知识小结背景1:TCP握手 internet上的两台机器A,B要建立起HTTP连接了,在这之前要先建立TCP连接,情景大概是这样子的: A:你好,我跟你建立一个TCP好吗? B:好啊. A ...
shell 环境变量的知识小结
环境变量的知识小结:·变量名通常要大写.·变量可以在自身的Shell及子Shell中使用.·常用export来定义环境变量.·执行env默认可以显示所有的环境变量名称及对应的值.·输出时用“$变量名” ...
180531-Spring中JavaConfig知识小结
原文链接:Spring中JavaConfig知识小结/ Sring中JavaConfig使用姿势去掉xml的配置方式,改成用Java来配置,最常见的就是将xml中的 bean定义, scanner包 ...
javascript之正则表达式基础知识小结
javascript之正则表达式基础知识小结,对于学习正则表达式的朋友是个不错的基础入门资料. 元字符 ^ $ . * + ? = ! : | \ / ( ) [ ] { } 在使用这些符号时需要 ...
PS修图知识小结
PS修图知识小结 [1]人去除红眼. 1.用红眼工具,框选红眼不分. 2.用椭圆选区工具,选择红眼部分 3..创建调整图层,亮度.对比度.加大对比度. 4.选择红眼部分.创建调整图层,可选颜色,减 ...

随机推荐

jquery判断滚动条是否到底部
clientHeight:这个元素的高度,占用整个空间的高度,所以,如果一个div有滚动条,那个这个高度则是不包括滚动条没显示出来的下面部分的内容.而只是单纯的DIV的高度. offsetHeight ...
Qt正则表达式提取数据
这几天在上嵌入式课程设计,需要用到Qt,这个是信号与槽的,寒假的时候也简单学习了一些,但是没有怎么深入,又回过来看了看Qt,发现Qt的ui界面配置与Android的好像,当然Qt也可以拿来开发Andr ...
[Angular-Scaled web] 5. ui-router $stateParams for sharing information
When using ui-route, we want to pass the information with the url. Example: angular.module('categori ...
redhat下安装mysql 5.6.20,解压zip包，查看已经安装过的mysql,卸载rpm安装包，安装mysqlserver端和client，改动mysqlusername,登陆mysql，启动关闭mysql
1 将相关的mysql rpm包上传到redhat上 2 我的电脑是Redhat 6.*版本号.所以这里使用上面一个 3 解压zip包 4 安装下面几个rpm MySQL-client-a ...
grid control 11.1.0.1 安装指南
grid control 11.1.0.1 安装指南废话少说,进入正题系统版本号 [root@gridcontrol ~]# lsb_release -a LSB Version: :bas ...
MFC用代码加入对话框背景图片和button图片
执行环境:VS2013 一.加入对话框背景图片 ①插入位图,把生成的空白位图进行替换(xxx.bmp图片的名称和格式与生成的空白位图保持一致) ②查看属性,得到位图ID ③编写代码: void CMF ...
TP框架ajax U方法不解析怎么办？
TP框架中ajax U方法不解析 ajax U方法不解析 ajax url不解析问题: 造成问题原因: Js 存在单独的 js文件中和html分离了.造成不解析! 解决方法: 方法一:将js放到ht ...
crypto AES 加密解密
1.aes加密解密说明 https://juejin.im/entry/59eea48e6fb9a0451968c25f aes是对称加密算法 md5是摘要算法,不算是加密,主要用来对信息一致性和完整 ...
基于 bootstrap 的数据展示--bootgrid 样式改动。
bootgrid 的官网案例 http://www.jquery-bootgrid.com/Examples 官方demo 样式基于项目须要,取消了一些不须要的功能,改动了源代码最后样式成了这样 ...
UIScrollView 循环滚动，代码超简单
如今非常多应用里面多多少少都用到了循环滚动,要么是图片.要么是view,或者是其它,我总结一下,写了个demo分享给大家. 先看代码之后在讲原理: 1.创建一个空的项目(这个我就不多说了). 2.加入 ...

2018.7.13vue知识小结

2018.7.13vue知识小结的更多相关文章

随机推荐

热门专题