element-ui 页头pageheader报错

最新推荐文章于 2023-09-06 00:02:10 发布
最新推荐文章于 2023-09-06 00:02:10 发布
阅读量1k 收藏
点赞数
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_44392027/article/details/118258365
版权

昨天使用element-ui页头，看了文档，上了手，报错!

属性或方法“goBack”不是在实例上定义的，而是在呈现期间引用的。通过初始化属性，确保此属性是被动的，无论是在数据选项中，还是对于基于类的组件
查看了代码，由于是vue-cli3版本搭建的项目，使用vue add element，也选择的全部导入，所以应该不存在导入问题，所以第一反应是需要初始化，仔细查过，不用。。。
2.npm下载的依赖包，可能网速问题导致依赖下载不完全或者错误。结果node_modules里面找到在这里插入图片描述
3.重新下载一遍。无用
4.发现问题好像就我一个人有，怀疑人生，只有去github下载项目查找别人成功的项目

问题解决：
页头的el-page-header标签需要el-header标签包裹

在这里插入图片描述
我把自己垃圾哭了，再见

天上人间一样愁
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
Element PageHeader页头的使用方法
12-28
组件— 页头 基础 <el back=goBack content=详情页面> </el> [removed] export default { methods: { goBack() { console.log('go back'); } } } [removed] Attributes Events Slots 到此这篇关于Element PageHeader页头的使用方法的文章就介绍到这了,更多相关Element PageHeader页头内容请搜索软件开发网以前的文章或继续浏览下面的相关
ElementUI 页头组件
爱喝水的qdy的博客
11-23 3484
目录官方地址基本使用属性事件Slots 官方地址 https://element.eleme.io/#/zh-CN/component/page-header 基本使用 <el-page-header></el-page-header> <el-page-header @back="goBack" content="详情页面"> </el-page-hea...
el-page-header属性修改
楊帥
05-14 6294
按照官方文档样式，上代码： <el-page-header @back="goBack" content="详情页面" style="color: white;line-height: 60px;margin-left: 20px;" > </el-page-header> 效果： 这里可以看出来content无法解决，找遍了官方文档和百度搜索，没有发现如何设置。 最终在github上边看
Vue slot 插槽灵活使用
izhaong
04-27 209
文章目录可内嵌 说明: 常见语法请到官网查看, 本文收录不常见的用法 可内嵌 slot插槽可以向<div>标签一样内容使用 例如: <slot name="tableHeader"> <el-header v-show="showHeader" style="height: 50px;" class="pag...
Element中el-page-header页头的用法
m0_51044151的博客
04-30 6969
在开发项目中使用到页头这一组件，官网描述很简单，这个组件本身也很简单 去官网看看 官网就只给出这一个例子以及相关参数事件。我今天所说的就是back这个事件，这个就是页头跳转所触发的事件，通过官网给出的代码来看，需要执行goBack()方法。 因此我们可以通过该方法编写想要跳转的路径 html代码 <el-page-header @back="goBack" :title="title" style="color: #4490f1"> 我是使用Steps 步骤条才使用的这个组件，因为修改页头
头部菜单下划线效果
LILEILEILOVE的博客
11-15 149
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <style> nav { position: relative
ElementUI浅尝辄止30：PageHeader 页头
渣渣砖
09-06 1354
如果页面的路径比较简单，推荐使用页头组件而非面包屑组件。
el-breadcrumb(面包屑)和el-page-header(页头)的入门学习
qq_40765784的博客
06-24 4459
el-breadcrumb和el-page-header的入门学习
Element框架之Navigation--nav导航
woshierdanya的博客
08-08 1511
1.NavMenu 导航菜单 ¶ 顶栏 适用广泛的基础用法。 导航菜单默认为垂直模式，通过mode属性可以使导航菜单变更为水平模式。另外，在菜单中通过submenu组件可以生成二级菜单。Menu 还提供了background-color、text-color和active-text-color，分别用于设置菜单的背景色、菜单的文字颜色和当前激活菜单的文字颜色。 <el-menu :defa...
element组件---导航组件
weixin_45343882的博客
08-08 920
NavMenu 导航菜单 为网站提供导航功能的菜单。 顶栏 适用广泛的基础用法。 <el-menu :default-active="activeIndex" class="el-menu-demo" mode="horizontal" @select="handleSelect"> <el-menu-item index="1">处理中心</el-menu-i...
【Vue | 补洞 | 13】三种插槽的应用
weixin_42678675的博客
03-22 1489
用生活小常识，理解三种插槽的作用与应用场景！
详解Vue后台管理系统开发日常总结(组件PageHeader)
10-16
主要介绍了详解Vue后台管理系统开发日常总结(组件PageHeader)，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧
element-ui.rar element-ui核心库压缩包
12-20
element-ui.rar element-ui核心库压缩包
vue+element-ui动态生成多级表头的方法
10-18
今天小编就为大家分享一篇vue+element-ui动态生成多级表头的方法，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧
HTML+Element-ui邮件管理前端界面
07-12
若element-ui显示故障： 1.查看是否引用 <!--引入 element-ui 的样式，--> <link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css"> <!-- 必须先引入vue， 后使用element-ui -->...
element-ui 2.15.14版本
最新发布
10-09
免费下载、免费下载、免费下载，下载后挂载nginx、tomcat、apache服务器下运行，也可以使用vs code打开使用live server访问
组件-Element—PageHeader（ 页头）
GU_AO_SHI_TAI_DU的博客
07-04 9860
组件-Element—PageHeader（ 页头） 组件— 通知 基础 <el-page-header @back="goBack" content="详情页面"> </el-page-header> <script> export default { methods: { goBack() { console.l...
vue 自定义模态框组件 用.sync修饰
宁夏前端工程师，马卫斌，wx：1457508895
01-29 352
vue自定义模态框组件，父级引入。
element-ui :model=ruleForm报错
05-22
如果你在使用 Element UI 的表单组件时出现了 `:model` 和 `ruleForm` 报错的问题，通常是因为你的 Vue 组件中没有定义 `ruleForm` 对象或者没有正确绑定 `:model` 属性。 在使用 Element UI 表单组件时，你需要定义一个数据对象来存储表单数据，并将其绑定到表单组件的 `:model` 属性上。例如： ``` <el-form :model="ruleForm"> <el-form-item label="用户名" prop="username"> <el-input v-model="ruleForm.username"></el-input> </el-form-item> <el-form-item label="密码" prop="password"> <el-input type="password" v-model="ruleForm.password"></el-input> </el-form-item> </el-form> ``` 在上面的例子中，我们定义了一个名为 `ruleForm` 的对象，并将其绑定到 `:model` 属性上。同时，我们使用 `v-model` 指令将输入框的值与 `ruleForm` 对象中的对应属性绑定起来。 如果你在使用 Element UI 表单组件时出现了类似 `:model` 和 `ruleForm` 报错的问题，你可以检查以下几点： 1. 是否已经定义了 `ruleForm` 对象 2. 是否正确地绑定了 `:model` 属性 3. 是否在表单组件的 `<el-form-item>` 标签中正确地设置了 `prop` 属性，以便进行表单验证 希望这能帮助你解决问题。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值