class不可以作为一个props属性

最新推荐文章于 2023-01-03 21:50:56 发布
最新推荐文章于 2023-01-03 21:50:56 发布
阅读量563 收藏
点赞数
文章标签： vue
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_36430673/article/details/105954772
版权

最近在做组件升级（vue 1.x 升级vue 2.x），其中有一个组件，估计是当时些那个组件的小伙伴粗心吧，在props里放了一个不用的classs属性， vue 1.x项目里面居然没有报错，然鹅到2.x 里面就没有那么好了。
在这里插入图片描述
检查了一下，是因为这个原因
在这里插入图片描述
延伸一下，除了class，还有style是保留属性，不能作组件支持。所以，不要在props里面不要传入这样的字眼就好了。

~ climber ~
关注
【React系列】父子组件通信—props属性传值
川峰的博客
01-02 1397
AppMainAppHeaderHeaderHeaderMainBanner总之，在一个React项目中，组件之间的通信是非常重要的环节；props。
组件传值-插槽-props-动态class
qq_51545970的博客
08-30 1246
vue组件之间传参
(二)01 -设置子组件的特性&事件——父组件的特性默认会传递给子组件内的根元素 & 子组件有 props 则不能设置元素的特性class-style
weixin_44867717的博客
03-17 314
设置子组件的特性&事件——父组件的特性默认会传递给子组件内的根元素 & 子组件有 props 则不会设置元素的特性 封装通用组件的时候使用 调用组件的时候给目标标签设置属性 调用组件的时候给组件内部的元素设置原生事件 设置属性 替换-合并已有的特性 父组件的特性默认会传递给子组件内的根元素 class 和 style 会合并 如果子组件有 props 则不会设置元素的特...
vue组件通信---父传子(props方式)
zyy_wx的博客
09-24 1220
vue组件通信---父传子(props方式)
Web前端开发之VUE08——动态class的优化、props验证
DRLDER的博客
04-15 1034
目录 动态class的优化： props验证： 动态class的优化： 在往期的class中我们会使用对象键值对直接输入在标签上，这样会使属性过长。 使用data的对象传入是一个不错的解决办法。 示例代码： style操作过程中发现animation不能被编译，貌似是因为vue给class动态绑定了哈希，但是style动态没有绑定哈希导致的。 下面看一个示例： <template> <div> <div class="text".
vue基本应用之props
yyclassmvp的博客
12-22 435
组件间通信 1. props配置项 props通常适用于父组件给子组件传递消息 1.1 传递消息 //在父组件中引用子组件DEMO <Demo :todos="list"/> 给子组件传递一个名为‘todos’，value值为list的消息,需要加上 ： 1.2 接收消息 第一种方式（只接收）：props:['name'] 第二种方式（限制类型）：props:{name:String} 第三种方式（限制类型、限制必要性、指定默认值）： props:{ name:{ type:S
Vuejs 使用Props 传值实例
Johnny Liao的博客
01-11 8081
问题提出 往往我们在开发的过程中, 需要在另一个组件控制子组件的变量,那么,这时候,使用子组件的props来传值就可以很好地解决这个问题; 需求 假如我们需要将弹窗做成一个组件公用,那么在父组件或者另一个组件中,需要控制弹窗的显示与否,那么我们就需要将变量交给父组件来控制。 子组件的写法如下: style&gt; .modal-mask { position: fixe
3_Props属性.pdf
09-13
这里，`{pic}`被包裹在括号中，这是因为JSX需要解析变量，括号表示这是一个JavaScript表达式，它会先计算括号内的值，然后将其作为属性值传递给组件。 除了`source`，还可以使用`style` prop来调整组件的样式，如...
vue组件获取props_vue组件之属性Props
weixin_32051661的博客
12-24 1590
组件的属性和事件父子组件之间的通信父子组件之间的通信就是 props down,events up，父组件通过 属性props向下传递数据给子组件，子组件通过 事件events 给父组件发送消息。比如，子组件需要某个数据，就在内部定义一个prop属性，然后父组件就像给html元素指定特性值一样，把自己的data属性传递给子组件的这个属性。而当子组件内部发生了什么事情的时候，就通过自定义事件来把这个...
vue框架中props的typescript用法详解
10-15
接下来，我们来看Vue中的props属性是如何与TypeScript结合使用的。在Vue组件中，props主要用于从父组件接收数据。在TypeScript中使用props时，我们可以给每个prop定义类型，从而确保接收的数据符合预期。例如，在...
JavaScript之DOM对象
m0_51892736的博客
08-29 1362
JavaScript之DOM对象
vue源码（五）Vue 选项的规范化
nicexibeidage的博客
08-23 2300
本文是学习vue源码，之所以转载过来是方便自己随时查看，在这里要感谢HcySunYang大神，提供的开源vue源码解析，写的非常非常好，简单易懂，比自己看要容易多了，他的文章链接地址是http://hcysun.me/vue-design/art/ 注意：本节讨论依旧沿用前文的例子 #弄清楚传递给 mergeOptions 函数的三个参数 这一小节我们继续前面的讨论，看一看 mergeOpt...
React源码阅读（一）——creatElement
weixin_45452083的博客
11-01 368
一、React.createElement(type,config[…children])源码分析 在react中，通过createElement进行虚拟dom的创建，createElement接收三个参数， （类型，属性，子类）= （type, config, children） export function createElement(type, config, children) { // type的值可能为 function， text，div等 let propName; // 提
vue9种跨组件传参-props、$emit、$refs、$EventBus、消息订阅与发布...
TKY666的博客
08-29 3926
通过 props 传递 通过 $emit 触发自定义事件 使用 ref EventBus $parent 或$root attrs 与 listeners Provide 与 Inject Vuex
vue 组件传值class值
weixin_35749440的博客
01-03 749
在 Vue 中，组件之间可以通过 props 属性进行传值。 例如，如果你希望父组件能够给子组件传递一个 class 值，你可以在父组件中使用如下代码： <template> <child-component class="some-class"></child-component> </template> ...
VUE组件：组件的数据传递（props）
weixin_41350225的博客
04-09 6238
组件的数据传递props的作用使用props流程①给组件添加props选项②在调用组件时传入实际参数即可③完整代码及效果④使用props传递分析使用props传递数据时的一些细节①传参时，名称格式的问题②传递动态数据③Vue2参数传递是单向数据流在子组件中如何使用参数props①参数原封不动的使用②参数作为某种状态的初始值使用③参数作为需要被转换的原始值使用对传入参数props进行数据验证①使用对...
vue中的props
PCthedream的博客
11-07 2044
StuProps.vue: App.vue: 页面效果图; 静态props: 动态props: 单项数据流： [slot-具名插槽]
关于Vue中props的详解
热门推荐
jingtian678的博客
07-23 13万+
看一下官方文档： 组件实例的作用域是孤立的。这意味着不能 (也不应该) 在子组件的模板内直接引用父组件的数据。父组件的数据需要通过 prop 才能下发到子组件中。 也就是props是子组件访问父组件数据的唯一接口。 详细一点解释就是： 一个组件可以直接在模板里面渲染data里面的数据（双大括号）。 子组件不能直接在模板里面渲染父元素的数据。 如果子组件想要引用父元素的数据，那么就在...
Vue系列： 如何通过组件的属性props设置样式
weixin_34247155的博客
08-13 903
比如我们要在vue中显示百度地图，然后将相关的代码包装成组件，然后需要由外部来设置组件的高度，关于props的介绍，可以参考：http://cn.vuejs.org/guide/components.html#Props 所以我在该组件的内部添加了mapHeight属性，如下：props:{    // 地图在该视图上的高度    mapHeight:{      type: Number,   ...
使用原生js将props参数作为产生的DOM的标签属性。
最新发布
05-26
感谢您的问题！您可以参考以下代码： ``` function createDOMElement(tagName, props) { const element = document.createElement(tagName); for (const prop in props) { if (props.hasOwnProperty(prop)) { element.setAttribute(prop, props[prop]); } } return element; } // 示例调用 const myProps = { id: 'myElement', class: 'special', 'data-custom': 'some data', }; const myElement = createDOMElement('div', myProps); ``` 此代码可以接收一个标签名称以及一个包含属性的对象。它会使用 `document.createElement()` 创建一个新的 DOM 元素，并循环遍历传入的属性对象，将每个属性作为 DOM 元素的属性。最后返回已创建的 DOM 元素。 请注意，如果您使用的是 React 或类似的框架，可能不需要手动处理 DOM。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值