<script> import {mapGetters} from 'vuex' export default { name: "index", data() { return { formData: { userName: "", password: "" } } }, computed: { ...mapGetters([ "getUserList" ]) }, methods: { login() { if (!this.formData.userName) { this.$message.warning("用户名不能为空") return false; } if (!this.formData.password) { this.$message.warning("密码不能为空") return false; } let loginUser = this.getLoginUser(this.formData.userName); if (!loginUser || loginUser.password != this.formData.password) { this.$message.warning("用户名或密码错误") return false; } localStorage.setItem("loginUser", JSON.stringify(loginUser)) localStorage.setItem("token", new Date().getTime() + "") this.$router.push({ name: 'main' }) }, getLoginUser(userName) { let userList = this.getUserList; for (let index = 0; index < userList.length; index++) { let user = userList[index]; if (userName == user.userName) { return user; } } return null; } } } </script>

这是一个Vue.js组件的脚本部分，其中：

1. `import {mapGetters} from 'vuex'` 引入了 `vuex` 库中的 `mapGetters` 方法，用于映射 `store` 中的 `getter` 函数到本组件的计算属性上。

2. `export default { ... }` 将该组件导出为默认模块，其中包含了组件的名称、数据、计算属性和方法。

3. `data()` 是一个Vue.js中的选项，用于定义组件的数据对象。该组件包含了一个 `formData` 对象，其中包含了用户名和密码的属性。

4. `computed` 是一个Vue.js中的选项，用于定义组件的计算属性。通过 `mapGetters` 方法，将 `getUserList` 函数映射到计算属性上。

5. `methods` 是一个Vue.js中的选项，用于定义组件的方法。该组件包含了一个 `login` 方法，用于处理用户点击登录按钮的事件。该方法会进行用户名和密码的校验，并将登录用户信息存储到本地存储中。如果校验成功，则通过路由跳转到主页面。

6. `getLoginUser` 是该组件的一个自定义方法，用于根据用户名获取用户信息。该方法会遍历 `userList` 列表，查找与输入用户名匹配的用户信息并返回。如果没有找到，则返回 `null`。