使用vue实现简易计算器

哈欠、

已于 2023-04-02 19:26:49 修改

阅读量486

点赞数

文章标签： vue.js html

于 2023-04-02 18:46:11 首次发布

本文链接：https://blog.csdn.net/qq_65771833/article/details/129914365

版权

该博客展示了如何使用Vue.js创建一个简易计算器，重点在于理解v-model的双向数据绑定。通过number类型转换、watch监听器等方法实现计算功能。

摘要由CSDN通过智能技术生成

效果明显，代码简单，方法贼多。

效果图

代码部分

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<script type="text/javascript" src="js/vue.js"></script>
	</head>
	<body>
		<div id="app">
			<input type="text" placeholder="" v-model.number="number1" />
			<select v-model="opt">
				<option>+</option>
				<option>-</option>
				<option>*</option>
				<option>/</option>
			</select>
			<input type="text" placeholder="" v-model.number="number2" />
			<button @click=&#