1、应用场景
使用elementui实现一个输入框,输入100,下方显示10000。
2、实现源码
(1)主页面
<template> <el-row> <el-tabs v-model="activename" @tab-click="handlerclick"> <el-tab-pane label="饼图" name="pie2d"> <el-date-picker v-model="value2" type="month" placeholder="选择月"> </el-date-picker> <el-col :span="12"> <div id="epie2d" :style="{width:'1920px',height:'800px'}"></div> </el-col> </el-tab-pane> <el-tab-pane label="柱状图" name="column2d"> <el-col :span="12"> <div id="column2d" :style="{width:'1920px',height:'800px'}"></div> </el-col> </el-tab-pane> <el-tab-pane label="过滤器" name="filter"> <el-col :span="12"> <div id="filterdata" :style="{width:'1900px',height:'800px'}"> <el-input v-model="olddata"></el-input> <label>{{olddata | power}}</label> </div> </el-col> </el-tab-pane> </el-tabs> </el-row> </template>
(2)javascript
<script> export default { name: 'epie2d', data() { return { olddata:'' } }, filters: { power: function(value) { return value * value; } } } </script>
3、实现效果
总结
以上所述是小编给大家介绍的使用vue.js中的过滤器实现幂方求值,希望对大家有所帮助
如对本文有疑问, 点击进行留言回复!!
vue源码实战render.js与$nextTick的异步调用
同事牛逼啊,写了个隐藏 bug,我排查了 3 天才解决问题!
【JavaScript笔记(一)】万丈高楼平地起 - 基本概念篇
网友评论