20240909uniapp学习工作-VUE

应用实例必须在调用了 .mount() 方法后才会渲染出来. 该方法接收一个 "容器" 参数, 可以是一个实际的 DOM 元素或是一个 CSS 选择器字符串:

<div id="app"></div>
app.mount('#app')

应用根组件的内容将会被渲染在容器元素里面。容器元素自己将不会被视为应用的一部分。

.mount() 方法应该始终在整个应用配置和资源注册完成后被调用。同时请注意,不同于其他资源注册方法,它的返回值是根组件实例而非应用实例。

在我们的 uniapp 项目中, 没有找到对 mount 的调用, 后面学 uniapp 指定教程应该会知道怎么回事.

这些好像都不太重要. 重点应该是 vue 的语法.

最基本的数据绑定形式是文本插值:

<span>Message: {{ msg }}</span>

双大括号标签会被替换为相应组件实例中 msg 属性的值. 同时每次 msg 属性更改时它也会同步更新. 没记错的话, 属性应该是在 data() 那块定义的. 如 companyName 属性:

export default {
		data() {
			return {
				companyName: '',
			}
		},
}

Attribute 绑定

双大括号不能在 HTML attributes 中使用. 想要响应式地绑定一个 attribute, 应该使用 v-bind 指令:

<div v-bind:id="dynamicId"></div>

v-bind 指令指示 Vue 将元素的 id attribute 与组件的 dynamicId 属性保持一致。如果绑定的值是 null 或者 undefined,那么该 attribute 将会从渲染的元素上移除。

看到这去公司项目搜了下 v-bind, 以为没有呢.

其实是 v-bind 太常用, 一般都用简写语法:

<div :id="dynamicId"></div>

如果 attribute 的名称与绑定的 JavaScript 值的名称相同,那么可以进一步简化语法,省略 attribute 值, 比如组件有个属性就叫 id:

<!-- 与 :id="id" 相同 -->
<div :id></div>

<!-- 这也同样有效 -->
<div v-bind:id></div>

动态绑定多个值

如果你有像这样的一个包含多个 attribute 的 JavaScript 对象:

const objectOfAttrs = {
  id: 'container',
  class: 'wrapper',
  style: 'background-color:green'
}

通过不带参数的 v-bind, 可以将它们绑定到单个元素上:

<div v-bind="objectOfAttrs"></div>

今天就到这, 安卓项目出了个问题, 要去修改下, 不然还有一个小时下班. 

现在是4点半哦. 这公司最好的点就是从来不加班了.

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值