Powered by md-Blog  文 - 篇  访客 -

  • Vue筛选过滤,使用filter过滤实现搜索

    模板代码<input type="text" placeholder="过滤ID" v-model="filter_sku_id" /> <table> <tr v-for="(item,index) of sku_id_data_list" :key="item.id"> <td>{{ index + 1 }}</td> <td>{{item.sku_id}}</td> </tr> </table>sku_id_data 为获取数据computed: { sku_id_data_list() { retur

    2020-11-07 15:59:21   2020-11-07 15:59:21
    分类:Vue / 浏览:016047359615457
  • Vue.js子组件传值给父组件并且赋给v-model

    子组件:这里注意一定要传给 inputmethods: { this.$emit('input', '我的要传的值'); }父组件:drop-down 为一个组件名<drop-down v-model="myDrop"></drop-down> {{ myDrop }}../../md/Vue/

    2020-11-01 17:25:28   2020-04-23 13:50:49
    分类:Vue / 浏览:015876210496651
  • Vue.js的优点

    1、体积小压缩后 33k2、更高的运行效率基于预操作的虚拟DOM3、响应式编程双向数据绑定这里的响应式不是 @media 媒体查询中的响应式布局,而是指 vue.js 会自动对页面中某些数据的变化做出响应。这也就是 vue.js 最大的优点,通过MVVM思想实现数据的双向绑定,让开发者不用再操作dom对象,有更多的时间去思考业务逻辑

    2020-11-01 17:25:28   2020-03-30 09:54:44
    分类:Vue / 浏览:015855332844656
  • Vue.js通过:is进行动态组件切换

    Vue.js 中,我们可以使用 :is 进行组件的动态切换。示例<template> <div> <!-- 点击按钮,切换组件 --> <button @click="showWhat = 'A'">showA</button> <button @click="showWhat = 'B'">showB</button> <!-- 组件 --> <keep-alive> <component :is="showWhat"></component> &

    2020-11-01 17:25:28   2020-06-08 10:30:09
    分类:Vue / 浏览:015915834098413
  • Vue Router 配置教程及嵌套路由、传参、动画效果等

    安装yarn add vue-router入口配置main.jsimport Vue from 'vue' import router from './router' // 添加 new Vue({ el: '#app', router, // 添加 render: h => h(App) });配置文件router/index.jsimport Vue from 'vue' import Router from 'vue-router' import Home from '@/Home' import Cart from '@/Cart' import Me from '@/Me' import NoPage from '@/NoPage' Vue.use(Router) const originalPush = Router.prototyp

    2020-11-01 17:25:27   2020-04-01 09:44:47
    分类:Vue / 浏览:015857054875021
  • Vue.js 使用ECharts制作图表

    安装yarn add echartsmain.js// echarts import echarts from 'echarts' Vue.prototype.$echarts = echartsecharts.vue<template> <div> <div id="home_charts" :style="{width: '300px', height: '300px'}"></div> </div> </template> <script> export default { mounted(){ this.drawLine(); }, methods: { drawLine(){ let home_charts = this.$ec

    2020-11-01 17:25:27   2020-06-23 20:50:32
    分类:Vue / 浏览:015929166325978
  • Vue.js创建项目之 vue init 和 vue create 的区别

    vue init是 Vue-cli2.x 的初始化方式,可以使用 Github 上面的一些模板来初始化项目webpack 是官方推荐的标准模板名使用方式:vue init webpack 项目名称electron-vue 的模板使用方式:vue init simulatedgreg/electron-vue 项目名称vue create是 Vue-cli3.x 的初始化方式,模板是固定的,模板选项可自由配置使用方式:vue create 项目名称../../md/Vue/

    2020-11-01 17:25:27   2020-04-02 11:00:10
    分类:Vue / 浏览:015857964104005
  • Vue.js加载时屏幕闪现使用v-cloak指令

    当网络较慢,网页还在加载 Vue.js,而导致 Vue 来不及渲染,这时页面就会显示出 Vue 源代码。我们可以使用 v-cloak 指令来解决这一问题。在简单项目中,使用 v-cloak 指令是解决屏幕闪动的好方法。但在大型、工程化的项目中(webpack、vue-router)只有一个空的 div 元素,元素中的内容是通过路由挂载来实现的,这时我们就

    2020-11-01 17:25:27   2020-05-27 12:43:05
    分类:Vue / 浏览:015905545855841
  • Vue.js子组件获取调用父组件的方法

    直接使用 this.$parent.event 来调用父组件的方法 this.$parent.fatherMethod();../../md/Vue/

    2020-11-01 17:25:27   2020-07-29 18:20:59
    分类:Vue / 浏览:015960180591555
  • Vue.js按下回车Enter、退出Esc、删除退格键delete、空格space、Tab和方向键的按键绑定

    参考绑定方法有:.enter.tab.delete (捕获“删除”和“退格”键).esc.space.up.down.left.rightDemo.vue<template> <div class="demo"> <input v-on:keyup.delete="deleted" v-on:keyup.enter="submit" v-on:keyup.esc="esc" placeholder="按键检测"> </div> </template> <script> export default

    2020-11-01 17:25:27   2020-03-31 16:34:52
    分类:Vue / 浏览:015856436921530
  • 春明


     
    百度站内搜索


  • 晋ICP备18012953号-1
  • 百度统计