Vue报错”Uncaught SyntaxError: Unexpected token :“

程序员文章站 2022-05-23 11:10:23

...

错误

错误代码

<!DOCTYPE html>
<html>
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
		<title>Vue学习</title>
		<!-- 使用CDN引入Vue.js -->
		<script type="text/javascript" src=" https://cdnjs.cloudflare.com/ajax/libs/vue/2.1.8/vue.min.js"></script>
	</head>
	<body>
		<div id="app">
			<form name="loginForm">
				<!-- 下拉列表框 -->
				身份：
				<select name="identity" v-model="identity">
					<option value="">请选择身份...</option>
					<option value="学生">学生</option>
					<option value="教师">教师</option>
					<option value="管理员">管理员</option>
				</select><br>
				<!-- 文本框 -->
				用户名：
				<input type="text" v-model="username"><br>
				<!-- 密码框 -->
				密码：
				<input type="password" v-model="password"><br>
				<!-- 复选框 -->
				<input type="checkbox" v-model="rememberMe">记住我<br>
				<!-- 按钮 -->
				<input type="button" value="重置" v-on:click="reset()">
				<input type="button" value="登录" v-on:click="login()">
			</form>
		</div>
		<script>
			new Vue({
				el: '#app',
				data: {
					identity:"管理员",
					username: '张三',
					password: '12345',
					rememberMe:true
				},
				methods: {
					reset:function(){
						identity:"",
						username:"",
						password:"",
						rememberMe:false
					},
					login:function(){
						alert("登录");
					}
				}
			})
		</script>
	</body>
</html>

原因

解决

修改冒号即可，改为正确的语法。

正确代码

<!DOCTYPE html>
<html>
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
		<title>Vue学习</title>
		<!-- 使用CDN引入Vue.js -->
		<script type="text/javascript" src=" https://cdnjs.cloudflare.com/ajax/libs/vue/2.1.8/vue.min.js"></script>
	</head>
	<body>
		<div id="app">
			<form name="loginForm">
				<!-- 下拉列表框 -->
				身份：
				<select name="identity" v-model="identity">
					<option value="">请选择身份...</option>
					<option value="学生">学生</option>
					<option value="教师">教师</option>
					<option value="管理员">管理员</option>
				</select><br>
				<!-- 文本框 -->
				用户名：
				<input type="text" v-model="username"><br>
				<!-- 密码框 -->
				密码：
				<input type="password" v-model="password"><br>
				<!-- 复选框 -->
				<input type="checkbox" v-model="rememberMe">记住我<br>
				<!-- 按钮 -->
				<input type="button" value="重置" v-on:click="reset()">
				<input type="button" value="登录" v-on:click="login()">
			</form>
		</div>
		<script>
			new Vue({
				el: '#app',
				data: {
					identity:"管理员",
					username: '张三',
					password: '12345',
					rememberMe:true
				},
				methods: {
					reset:function(){
						this.identity="",
						this.username="",
						this.password="",
						this.rememberMe=false
					},
					login:function(){
						alert("登录");
					}
				}
			})
		</script>
	</body>
</html>

Vue报错”Uncaught SyntaxError: Unexpected token :“

错误

错误代码

原因

解决

正确代码

Uncaught SyntaxError: Unexpected end of input异常

Vue报错：Uncaught TypeError: Cannot assign to read only property’exports‘ of object

js报错：Uncaught SyntaxError: Unexpected string

解决vue打包后刷新页面报错：Unexpected token <

IE 报错 -- ‘SyntaxError：strict 模式下不允许一个属性有多个定义‘ ,基于vue element-ui页面跳转坑的解决

Vue报错：Uncaught TypeError: Cannot assign to read only property’exports‘ of object’#

Vue项目报错：Uncaught SyntaxError: Unexpected token <

vue-cli 打包后提交到线上出现 "Uncaught SyntaxError:Unexpected token" 报错

vue报错Uncaught (in promise) NavigationDuplicated {_name: "NavigationDuplicated", name: "NavigationDup

vue 报错Error in mounted hook: "SyntaxError: Unexpected token u in JSON at position 0"