解决 uniapp 修改uview样式,h5端生效,在微信小程序不生效。

这篇具有很好参考价值的文章主要介绍了解决 uniapp 修改uview样式,h5端生效,在微信小程序不生效。。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。

/deep/ 的兼容性不好,node-sass支持这个/deep/。但是 node-sass 被 sass 和现代项目抛弃了。 如果项目里装了sassnode-sass sass-loader会优先使用sass,sass只认识 ::v-deep

请根据自己的项目选择使用::v-deep还是/deep/文章来源地址https://www.toymoban.com/news/detail-770608.html

<template>
<view class="u-grid-x">
   <u-grid>
          <u-grid-item>1</u-grid-item>
          <u-grid-item>2</u-grid-item>
          <u-grid-item>3</u-grid-item>
   </u-grid>
</view>
</template>

<script>
 export default {
    options: {
      styleIsolation: 'shared',
    }
   }
</script>
<style lang="scss" scoped>
   // 方法1
  ::v-deep .u-grid {
    align-items: flex-start !important;
  }
  
   // 方法2
  ::v-deep .u-grid-x{ 
   .u-grid {
    align-items: flex-start;
  }
 }
</style>

到了这里,关于解决 uniapp 修改uview样式,h5端生效,在微信小程序不生效。的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请点击违法举报进行投诉反馈,一经查实,立即删除!

领支付宝红包 赞助服务器费用

相关文章

  • uniapp学习之【uniapp的返回事件 onBackPress 在微信小程序中不生效的问题】

    uniapp 的返回事件 onBackPress 在微信小程序中不生效的问题 场景 :页面中点击左上角的返回按钮,监听返回操作,页面返回前执行了一些操作, uniapp 页面生命周期中有 onBackPress ,因此将操作写在了 onBackPress () 页面生命周期钩子当中, H5 测试一切正常,但是微信开发工具中调试的时候

    2024年02月16日
    浏览(44)
  • uniapp开发小程序uview的u-button样式自定义修改

    u-button组件里:customStyle=\\\"样式数据名\\\" 在data里申明样式数据名,形式为对象,注意值要加引号,且有-的只要改为驼峰命名如border-Radius

    2024年02月03日
    浏览(43)
  • uniapp中发布为H5,在微信中自动播放音频和视频。

    uniapp中发布为H5,在微信中自动播放音频和视频。 安装微信jssdk 页面内使用: 这块最关键的就是引入jssdk!。经测试,音频自动播放效果相对稳定,兼容性也比较好。 安装微信jssdk npm install jweixin-module --save 页面内使用 经测试,ios/安卓都可以在微信浏览器中实现自动播放。如

    2024年02月08日
    浏览(40)
  • 每天bug---1、el-table 行加样式类名(row-class-name)生效了,但是效果检测不到;2、解决VUE项目在微信浏览器中使用支付宝支付提示复制链接到浏览器打开

    一、el-table 行加样式类名(row-class-name)生效了,但是效果检测不到 1、问题 2、解决 关闭浏览器,重启程序 二、解决VUE项目在微信浏览器中使用支付宝支付提示复制链接到浏览器打开 1、问题:在微信浏览器中访问支付宝支付接口 分析及解决:访问支付宝接口会返回一个f

    2024年02月13日
    浏览(52)
  • 【uniapp项目路由,配置,修改uni ui默认样式,小程序端不生效问题】

    对不同端的css样式不一样 使用 #ifdef #endif 包裹 (其中 MP 表示小程序端,表仅在小程序端是那个样式) 对不同端package.json中导航配置不同 1.使用 #ifdef #endif 包裹 2.使用自带配置 button按钮中样式自带after 当写border样式的时候会有一些问题 去除after的border 使用uni.navicateTo() 路由

    2024年02月02日
    浏览(85)
  • uniapp rich-text 富文本组件在微信小程序中自定义内部元素样式

    rich-text 富文本组件在 微信小程序 中,无法直接通过 外部css样式 控制文章内容样式。 解决方案:将传入的富文本内容截取并添加自定义样式类名 (1)全局配置filter方法,实现富文本内容截取转换,附上‘rich-txt-p’样式类 (2)在app.vue中编辑‘rich-txt-p’内容,即富文本需要

    2024年02月19日
    浏览(62)
  • uniapp中使用uview组件u-icon 编辑到微信小程序样式问题

    在微信小程序中用u-icon标签选择器才能对其设置样式,但在h5预览中u-icon{ }这样设置样式不生效,用组件的customStyle属性才生效。所以干脆对不同平台用不同写法: 同时在style标签里使用u-icon选择器写样式来作用于微信小程序中: 这样互不影响

    2024年02月16日
    浏览(70)
  • uniapp小程序用deep重写组件样式不生效 已解决

    deep只在h5中生效 但是在小程序中不生效 但是已找到解决办法。 在method同级下添加: options: { styleIsolation: ‘shared’ } 如下 然后再使用deep就可以了 如 效果就出来了:

    2024年02月12日
    浏览(43)
  • placeholder样式自定义(uniapp 微信小程序、h5)

    一、使用uniapp开发 ①第一种方式:(写在行内) ②第二种方式: (给input加上placeholder-class属性,然后给该属性 设置一个类名,在style中设置样式。) 二、使用H5开发

    2024年02月09日
    浏览(39)
  • 【element ui】 el-popover 样式修改不生效解决方法

    ①基本结构 ②问题 在修改el-popover的样式的时候,和往常修改elmentui样式一样就是不起效果。使用::v-deep或者是/deep/样式穿透都没有效果。 ③原因 看了一篇博主的博客才得知,原因是 el-popover生成的div不在当前组件之内,甚至不在App.vue组件的div内,他和App.vue组件的div平级。所

    2024年02月07日
    浏览(51)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包