如何使用Vue.js中的过滤器实现幂方求值

墨蓝 2024-04-17 05:52 7阅读 0赞

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、实现效果

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly95b3VoYWlkb25nLmJsb2cuY3Nkbi5uZXQ_size_16_color_FFFFFF_t_70][]

[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly95b3VoYWlkb25nLmJsb2cuY3Nkbi5uZXQ_size_16_color_FFFFFF_t_70]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/11/55f0561b29424a58ba85b9347187b904.png

发表评论取消回复

表情：

评论列表（有 0 条评论，7人围观）

还没有评论，来说两句吧...

相关阅读

相关如何使用Vue.js中的过滤器实现幂方求值

、应用场景使用ElementUI实现一个输入框，输入100，下方显示10000。 2、实现源码（1）主页面 <template> ...

墨蓝/ 2024年04月17日 05:52/ 0 赞/ 8 阅读

相关 c++求a的b次方/次幂

![watermark,type\_d3F5LXplbmhlaQ,shadow\_50,text\_Q1NETiBA6LaFMzM4,size\_20,color\_FFFFF

r囧r小猫/ 2023年09月30日 10:43/ 0 赞/ 17 阅读

相关 python实现pow函数（求n次幂，求n次方）

实现 pow(x, n)，即计算 x 的 n 次幂函数。其中n为整数。解法1：暴力法不是常规意义上的暴力，过程中通过动态调整底数的大小来加快求解。代码如下：

冷不防/ 2022年10月08日 02:28/ 0 赞/ 203 阅读

相关 matlab求方差、均方值和功率

% 求方差、均方值、功率等等，今天要弄明白了。 clc;clear all;close all; %实数域 x = [1;3

绝地灬酷狼/ 2022年09月10日 06:08/ 0 赞/ 192 阅读

相关【算法】求n的m次方（快速幂取模）

题目求n的m次方，n，m均为自然数。解析看似简单的题目，但是要想写的高效还不是那么容易想出来。实现 unsigned int power(

以你之姓@/ 2022年08月09日 06:45/ 0 赞/ 250 阅读

相关快速幂求x的n次方

问题 O(logn)的时间复杂度求x的n次方，x为自然数，n为整数？举例解析如果 power=5 为奇数，result保存当前的多余的一个4，并在返回结果时一

缺乏、安全感/ 2022年07月16日 09:55/ 0 赞/ 258 阅读

相关求方幂模s = a^j mod p

在编写程序时，经常求方幂模，即s = a^j mod p 而如果先求a^j，则可能会导致溢出，于是采用了一种避免溢出的算法ModularExponent 伪代码：

青旅半醒/ 2022年07月14日 08:11/ 0 赞/ 169 阅读

相关整数快速幂——次方求模

先上代码： unsigned Power(unsigned n, unsigned p) \{ // 计算n的p次方 unsigned odd = 1; //

迷南。/ 2022年06月12日 01:36/ 0 赞/ 242 阅读

相关求幂

东东对幂函数运算很感兴趣，在学习的过程中东东发现了一些有趣的性质：9^3=27^2,2^10 = 32^2.东东对这个性质充满了好奇，东东现在给出一个整数n，希望你能帮助他求出

左手的ㄟ右手/ 2022年06月08日 08:41/ 0 赞/ 186 阅读

相关方幂序列

题目如图 ![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLm

蔚落/ 2022年04月18日 01:49/ 0 赞/ 106 阅读