view标签里面的内容使用三元表达式条件渲染结果出错

最新推荐文章于 2023-10-12 16:27:03 发布

小猿～

最新推荐文章于 2023-10-12 16:27:03 发布

阅读量379

点赞数

分类专栏：小程序 JavaScript 文章标签： WXML 三元表达式视图渲染动态更新 wx:if

本文链接：https://blog.csdn.net/m0_56542366/article/details/127423373

版权

小程序同时被 2 个专栏收录

2 篇文章 0 订阅

订阅专栏

JavaScript

2 篇文章 0 订阅

订阅专栏

原wxml代码如下：

<view class="blue margin-bottom font-size">{{ISRIGHT ? currentRight : currentLeft}}</view>

ISRIGHT的值恒为true，运行发现结果一直显示currentRight，但currentRight不再显示刷新后的数据，即currentRight不变，与需求不合，实在找不到问题，console.log的值是变化的，因此决定另辟蹊径。

修改如下：

<view wx:if="ISRIGHT" class="blue margin-bottom font-size">{{currentRight}}</view>
<view wx:else class="blue margin-bottom font-size">{{currentLeft}}</view>

结果正确，currentRight的值可变。

但是还是不知道view标签里面的内容使用三元表达式条件渲染结果出错的原因，求大佬解惑

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

小猿～

关注关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
view标签里面的内容使用三元表达式条件渲染结果出错

view标签里面的内容使用三元表达式条件渲染结果出错
复制链接

扫一扫

专栏目录

微信小程序使用三元运算符动态渲染布局

衡与墨的博客

08-22

9453

今天在写微信小程序时，被坑到了， &amp;lt;!--.wxml-&amp;gt; &amp;lt;view class=&quot;row-in {{to_top ? 'to-top' : 'to-bottom'}}&quot;&amp;gt; ... &amp;lt;/view&amp;gt; 本意是想做一个简单的动态页面的，在用户点击按钮的时候，菜

vue 里的 ant design表格数据的字段转换处理，如日期、布尔类型、三元表达式判断等

荣默默的博客

02-11

2497

最近在使用vue ant design 的时候，在处理接口返回的列表数据的时候老是出现各种问题，比如接口里返回的是时间戳，怎么在表格里展示成日期格式；还有接口返回的是bool类型，怎么展示成对应的文字描述等，话不多说，直接上代码。 const columnsList = [ [ { title: "名称", align: "center", width: "200px", dataIndex: "name", scopedSlots

参与评论您还未登录，请先登录后发表或查看评论

【微信小程序】通过三元表达式给view动态设置class

川川的博客

02-17

1511

<button class="check-button {{btnDesc == '已核销' ? 'checked-color' : 'uncheck-color'}}" catchtap="payClick" hidden="{{payBtnHidden}}">{{btnDesc}}</button> 其中checked-color是“已核销”的按钮样式， uncheck-color是“核销”的按钮样式 ...

小程序 - scroll-view 滑动切换（三元运算符）

前端Cocoko

01-30

748

&amp;amp;lt;view class=&amp;quot;m-swiper-list&amp;quot;&amp;amp;gt; &amp;amp;lt;scroll-view scroll-x=&amp;quot;true&amp;quot; class=&amp;quot;navbar-box&amp;quot; scroll-left=&amp

vue在标签中使用三元表达式的注意点

逆风优雅的博客

07-22

4406

<use :xlink:href="iserWei?'#icon-diannaojiaobiao':'#icon-erweimajiaobiao1'"></use>  一定要在动态绑定的属性前面加上一个冒号，否则这个三元表达式会不生效的。 ...

2021-12-6 关于vue中axios访问到的数据打印在elementUI中tableData里面,进行三元运算访问性别sex0 1 2 转换为女男未知的方法, prop中的数据进行三元运算

qq_51055690的博客

12-06

2661

prop中字段数据进行三元运算 0 1 2 转换为女男未知

JS三目运算符失效原因（小程序）

Holeran的博客

03-26

1055

在学习的过程中，写一个小程序的小dome，使用到了三目运算符，然后遇到了了一个小问题，没有判断，第一个是啥，就显示啥原因：给false加上了引号 false不是字符串，不用加引号

wx:if三元表达式怎么写

03-27

wx:if三元表达式的写法如下： ``` <view wx:if="{{condition ? true : false}}">内容</view> ``` 其中，`condition` 是一个表达式，根据它的值来决定是否渲染 `view` 组件。如果 `condition` 的值为真，则渲染 `...

React的基本使用-JSX、创建视图、插值、条件输出、列表循环、属性表达式

此鱼非闲鱼也的博客

06-29

780

React基本使用 React是用于构建用户界面的 JavaScript 库。 React的特点：以声明式编写 UI，可以让你的代码更加可靠，并且更方便调试。组件逻辑使用 JavaScript 编写而不是模版，可以轻松地在应用中传递数据，而且使状态与 DOM 分离。还可以使用 Node 进行服务器渲染，或者使用 React Native 开发原生移动应用。 ReactDOM ReactDOM 提供了与浏览器交互的 DOM 功能，比如：dom 渲染 ReactDOM.render(element,

Vue基础

车明强的博客

11-30

393

一、了不起的vue 1. 官方介绍 Vue (读音 /vjuː/，类似于 view) 是一套用于构建用户界面的渐进式框架。与其它大型框架不同的是，Vue 被设计为可以自底向上逐层应用。Vue 的核心库只关注视图层，不仅易于上手，还便于与第三方库或既有项目整合。另一方面，当与现代化的工具链以及各种支持类库结合使用时，Vue 也完全能够为复杂的单页应用提供驱动。 npm 上每周包的下载量 Github上面的关注度 2.渐进式渐进式代表的含义是：没有多做职责之外的事。vue.js只提供了vue-

VUE-class样式

LzzMandy的博客

03-19

361

1、一般方式： <h1 class="red thin">普通方式</h1> 2、直接传递一个数组，注意：这里的 class 需要使用 v-bind 做数据绑定 <h1 :class="['thin', 'italic']">直接传递一个数组！</h1> 3、在数组中使用三元表达式 <h1 :class="['thin',...

小程序页面中的三元运算怎么写？

小码农吗

03-01

2601

一、class中我们怎样用三元运算统一内容在不同场景中，我们想要展示不同的排版，这个时候我们就需要写出两套样式。根据不同的判断选用不同的class index.wxml <view wx:if="{{isShow}}" class="{{list.length > 0 ? 'top' : 'left'}}"> index.wxss文件 .top { height: 74%; margin-top: 1%; } .left { height: 100%; margin-

微信小程序：三元表达式设置样式

eachanm的博客

08-31

4758

<view class="{{index == 0 ? 'getFocus' : 'lostFocus'}}">常用</view> index在js 的data里，getFocus和lostFocus是wxss的两个样式

uni-app开发微信小程序的报错[渲染层错误]排查及解决

10-12

1万+

通常情况下，在小程序启动时，启动页面依赖的所有代码包（主包、分包、插件包、扩展库等）的所有 JS 代码会全部合并注入，包括其他未访问的页面以及未用到自定义组件，同时所有页面和自定义组件的 JS 代码会被立刻执行。在这个配置中，button 和 list 两个自定义组件是跨分包引用组件，其中 button 在渲染时会使用内置组件 view 作为替代，list 会使用当前分包内的自定义组件 simple-list 作为替代进行渲染；在这两个分包下载完成后，占位组件就会被替换为对应的跨分包组件。

JS三元表达式动态改变显示内容

slow097的博客

10-13

323

根据后端传的值,来显示不同内容 1.条件写在差值作用域中 <view class=""> <text style="margin-left: 95rpx;">{{item.state == 0 ? '提现中' : item.state == 1 ? '提现成功' : item.state == 2 ? '提现失败':''}}</text> </view> 2.利用data改变 <view class=""

uniapp使用三元运算符动态绑定元素的style样式

qq_43671018的博客

07-27

2195

现在回到第一种方法，如果我们想要设置一个按钮，点击按钮同步改变style样式，有两种方式，改变其class或者style，但是我们都可以使用三运表达式来实现两种样式的切换。这是由于在Vue模板中，动态绑定样式时需要使用对象语法，通过将样式对象放在一个数组。中来动态绑定，这样做才可以确保样式对象被正确地解析和应用。，如果只是想动态绑定。

uni-app 三元运算动态计算class，数据改变后不生效，不再动态计算

itlsq的博客

04-08

2593

uni-app 三元运算动态计算class，数据改变后不生效，不再动态计算

MVC中View界面数据呈现示例

diehe5608的博客

06-24

222

@using System.Text; @model List<MvcShopping.Models.ProductCategory> @{ ViewBag.Title = "测试程序"; } <br />接收控制器传递的数据 @ViewBag.UserName <br />显示Model的名称：@Html.DisplayNameFo...

小程序中class属性值根据三元表达式判断得到