当前位置: 首页 > news >正文

uniapp基础-教程之HBuilderX基础常识篇02

uniapp创建项目时属性多为vue后缀;其中每个文件中都包含了三段式结构分别是template;script;style形势,分别是前端显示的画面以及js和css样式。

template:说大白话就是给别人看的,我们打开页面就可以看到的内容

例如:template就是装修的房子给其他人看的,而script就是你的仓库,可以通过仓库拿出一个东西。style就是你摆放的位置,让他摆放的位置不那么突兀。

这里说一下js

如:这段代码就是我们前端显示的画面

<template>
<view class="content">
<image class="logo" src="/static/logo.png"></image>
<view class="text-area">
<text class="title">{{title}}</text>
</view>
</view>
<template>

由js进行输出给前端

<script>
export default
data() {
return {
title:'Hello 微丽宝'
}
},
onLoad() {
},
methods: {
}
</script>

其中在data函数中输出的内容才可以在<template>进行使用或者显示,return 中我们看到他输出的是title,需要在template中显示则需要一个大阔号{{title}}包裹title;这个是我们常说的数据绑定。

onLoad就是生命周期函数,主要监听页面的加载;onshow就是监听页面显示时;详情可查看具体生命周期函数的解释https://uniapp.dcloud.net.cn/tutorial/page.html#pagefaq

methods写自定义函数在这个结构中定义多个方法

多个方法之间用逗号分割开,最后一个方法逗号省略

{data(){return{}},methods:{方法名1(形参列表){},方法名2(形参列表){},...}
}

原文地址:

uniapp教程之HBuilderX基础常识篇02 - 信息技术 - 微丽宝uniapp创建项目时属性多为vue后缀;其中每个文件中都包含了三段式结构分别是template;script;style形势,分别是前端显示的画面以及js和css样式这里说一下js如:这段代码就是我们前端显示的画面icon-default.png?t=N7T8https://www.dcyzq.cn/post/2412.html=<>

相关文章:

uniapp基础-教程之HBuilderX基础常识篇02

uniapp创建项目时属性多为vue后缀&#xff1b;其中每个文件中都包含了三段式结构分别是template&#xff1b;script&#xff1b;style形势&#xff0c;分别是前端显示的画面以及js和css样式。 template&#xff1a;说大白话就是给别人看的&#xff0c;我们打开页面就可以看到的…...

如何源码编译seaTunnel

如何源码编译seaTunnel 参考Set Up Develop Environment 编译前准备 下列软件需要提前安装好 GitJava ( JDK8/JDK11) 并设置JAVA_HOME 环境变量Scala (只支持 scala 2.11.12 )JetBrains IDEA . 下载源码并编译 git clone gitgithub.com:apache/seatunnel.git cd seatunne…...

msng病毒分析

这是一个非常古老的文件夹病毒&#xff0c;使用XP系统的文件夹图标&#xff0c;采用VB语言开发&#xff0c;使用了一种自定义的壳来保护&#xff0c;会打开网址http://www.OpenClose.ir,通过软盘、U盘和共享目录进行传播&#xff0c;会在U盘所有的目录下生成自身的副本&#xf…...

Unity安装

DAY1 下载Unity 打开Unity3D官网&#xff0c;下载Unity Hub&#xff0c;管理Unity的软件。链接https://unity.cn/releases (可能需要注册账号&#xff0c;就正常注册登录即可) 如果是新版的hub&#xff0c;可能长下面这个样子&#xff0c;还是英文的&#xff0c;点击圆圈的设…...

【代洋集团特惠好物:80瓦太阳能折叠包】

为您的绿色出行保驾护航&#xff01;代洋集团倾情推出80瓦太阳能折叠包&#xff0c;为您的户外活动提供清洁、便捷的电力支持。 这款太阳能折叠包采用高效能太阳能板&#xff0c;可折叠设计方便携带&#xff0c;轻松为您解决户外用电问题。80瓦的强大功率&#xff0c;让您在户…...

一致性Hash算法

Hash算法 哈希算法将任意长度的二进制值映射为较短的固定长度的二进制值&#xff0c;这个小的二进制值称为哈希值。哈希值是一段数据唯一且极其紧凑的数值表示形式。 Hash算法在安全加密领域MD5、SHA等加密算法&#xff0c;数据存储和查找的Hash表等方面均有应用。Hash表的数…...

linux 下如何将/dev/nvme0n1符格式化为空盘符

linux 下如何将/dev/nvme0n1符格式化为空盘符 作者&#xff1a;DPDK开发栏目&#xff1a;公开2023-08-30 03:01254 在Linux下&#xff0c;你可以使用以下步骤将/dev/nvme0n1硬盘格式化为空盘符&#xff1a; 首先&#xff0c;确保你拥有适当的权限。以管理员或root用户身份登录…...

IP地址的最后一位不可以为0或255

说明 通常情况下&#xff0c;IP 地址的最后一位不能为 0 或 255。这是因为这些特定的 IP 地址有特殊用途。 IP 地址的最后一位为 0 通常用作网络地址&#xff0c;表示整个网络的起始地址。IP 地址的最后一位为 255 通常用作广播地址&#xff0c;用于将数据包发送到同一网络中…...

代洋集团:太阳能智能座椅,创新能源的未来篇章

在代洋集团&#xff0c;我们致力于打造一个更绿色&#xff0c;更智能的未来。我们的太阳能智能座椅&#xff0c;就是我们对这一承诺的最新体现。 太阳能智能座椅&#xff0c;一种将绿色能源与智能化完美结合的产品。它利用高效的太阳能电池板&#xff0c;捕获并转化阳光为电能…...

linux服务器安装gitlab

一、安装gitlab sudo yum install curl policycoreutils-python openssh-server openssh-clients sudo systemctl enable sshd sudo systemctl start sshd sudo firewall-cmd --permanent --add-servicehttp curl https://packages.gitlab.com/install/repositories/gitla…...

Tlog SpringBoot3.x版本无法正常打印TraceId等数据

问题&#xff1a;Springboot3.0版本使用Tlog&#xff08;1.5.1版本&#xff09;开源框架时无法打印指定参数 原因&#xff1a;在Java EE 8及更高版本中&#xff0c;javax.servlet.*包已经替换成了jakarta.servlet.*&#xff0c;但是tlog官方只更新到了1.5.1版本所以还没支持到…...

基于Spring原生框架构建原生Spring的第一个程序!

&#x1f609;&#x1f609; 学习交流群&#xff1a; ✅✅1&#xff1a;这是孙哥suns给大家的福利&#xff01; ✨✨2&#xff1a;我们免费分享Netty、Dubbo、k8s、Mybatis、Spring...应用和源码级别的视频资料 &#x1f96d;&#x1f96d;3&#xff1a;QQ群&#xff1a;583783…...

[个人笔记] Git的CLI笔录

Git - CLI笔录 Git的CLI笔录 Git - CLI笔录Git的CLI笔录 Git的CLI笔录 origin: 表示远程仓库节点名称。 当有多个远程仓库时 可新增远程仓库节点名称如 new_origin | new_remote origin/HEAD: 表示当前Git仓库默认分支的引用&#xff0c;通常指向origin/master或origin/main g…...

如何运行C/C++程序

一、在线运行C/C 码曰 - 让代码在云端多飞一会&#xff1a;这是一个支持C/C&#xff0c;Java&#xff0c;Python等多种语言的在线编程&#xff0c;编译运行&#xff0c;粘贴分享的平台。你可以在这里输入你的代码&#xff0c;点击运行按钮&#xff0c;就可以看到输出结果。你也…...

HTML中input标签的23种type类型

一、概述 随着html5的出现&#xff0c;input标签新增了多种类型&#xff0c;用以接收各种类型的用户输入。其中传统输入控件有10种&#xff0c;新增输入控件有13种。 二、传统类型 传统输入控件有10种&#xff0c;如下所示 text 定义单行文本输入框 password 定义…...

接口多态与方法多态

作者简介&#xff1a;大家好&#xff0c;我是smart哥&#xff0c;前中兴通讯、美团架构师&#xff0c;现某互联网公司CTO 联系qq&#xff1a;184480602&#xff0c;加我进群&#xff0c;大家一起学习&#xff0c;一起进步&#xff0c;一起对抗互联网寒冬 在上一篇设计山寨版Str…...

js小技巧|如何提取经过Function函数混淆了的代码

关注它&#xff0c;不迷路。 本文章中所有内容仅供学习交流&#xff0c;不可用于任何商业用途和非法用途&#xff0c;否则后果自负&#xff0c;如有侵权&#xff0c;请联系作者立即删除&#xff01; 1.需求 星友发过来一个混淆代码&#xff0c;打开一看&#xff0c;长这…...

【GitLab】流水线入门

(꒪ꇴ꒪ )&#xff0c;Hello我是祐言QAQ我的博客主页&#xff1a;C/C语言&#xff0c;数据结构&#xff0c;Linux基础&#xff0c;ARM开发板&#xff0c;网络编程等领域UP&#x1f30d;快上&#x1f698;&#xff0c;一起学习&#xff0c;让我们成为一个强大的攻城狮&#xff0…...

es 中文前缀短语匹配(搜索智能补全)

需求&#xff1a;es进行前缀匹配&#xff0c;用来进行智能补全 过程&#xff1a;es正常的prefix只能进行词语匹配&#xff0c;而中文的分词大部分按字分词&#xff0c;不按语义分词&#xff0c;所以无法搜索出正确的前缀匹配&#xff0c;而能进行短语匹配的match_phrase_prefix…...

机器学习之决策树及随机森林

决策树 概念 决策树(Decision Tree)是一种常见的机器学习算法,用于分类和回归任务。它是一种树状结构,其中每个内部节点表示一个特征或属性,每个分支代表一个决策规则,而每个叶节点表示一个输出标签或值。 构建决策树过程 构建决策树的过程通常涉及以下步骤: 数据准…...

conda相比python好处

Conda 作为 Python 的环境和包管理工具&#xff0c;相比原生 Python 生态&#xff08;如 pip 虚拟环境&#xff09;有许多独特优势&#xff0c;尤其在多项目管理、依赖处理和跨平台兼容性等方面表现更优。以下是 Conda 的核心好处&#xff1a; 一、一站式环境管理&#xff1a…...

idea大量爆红问题解决

问题描述 在学习和工作中&#xff0c;idea是程序员不可缺少的一个工具&#xff0c;但是突然在有些时候就会出现大量爆红的问题&#xff0c;发现无法跳转&#xff0c;无论是关机重启或者是替换root都无法解决 就是如上所展示的问题&#xff0c;但是程序依然可以启动。 问题解决…...

C++实现分布式网络通信框架RPC(3)--rpc调用端

目录 一、前言 二、UserServiceRpc_Stub 三、 CallMethod方法的重写 头文件 实现 四、rpc调用端的调用 实现 五、 google::protobuf::RpcController *controller 头文件 实现 六、总结 一、前言 在前边的文章中&#xff0c;我们已经大致实现了rpc服务端的各项功能代…...

css实现圆环展示百分比,根据值动态展示所占比例

代码如下 <view class""><view class"circle-chart"><view v-if"!!num" class"pie-item" :style"{background: conic-gradient(var(--one-color) 0%,#E9E6F1 ${num}%),}"></view><view v-else …...

23-Oracle 23 ai 区块链表(Blockchain Table)

小伙伴有没有在金融强合规的领域中遇见&#xff0c;必须要保持数据不可变&#xff0c;管理员都无法修改和留痕的要求。比如医疗的电子病历中&#xff0c;影像检查检验结果不可篡改行的&#xff0c;药品追溯过程中数据只可插入无法删除的特性需求&#xff1b;登录日志、修改日志…...

1.3 VSCode安装与环境配置

进入网址Visual Studio Code - Code Editing. Redefined下载.deb文件&#xff0c;然后打开终端&#xff0c;进入下载文件夹&#xff0c;键入命令 sudo dpkg -i code_1.100.3-1748872405_amd64.deb 在终端键入命令code即启动vscode 需要安装插件列表 1.Chinese简化 2.ros …...

生成 Git SSH 证书

&#x1f511; 1. ​​生成 SSH 密钥对​​ 在终端&#xff08;Windows 使用 Git Bash&#xff0c;Mac/Linux 使用 Terminal&#xff09;执行命令&#xff1a; ssh-keygen -t rsa -b 4096 -C "your_emailexample.com" ​​参数说明​​&#xff1a; -t rsa&#x…...

Keil 中设置 STM32 Flash 和 RAM 地址详解

文章目录 Keil 中设置 STM32 Flash 和 RAM 地址详解一、Flash 和 RAM 配置界面(Target 选项卡)1. IROM1(用于配置 Flash)2. IRAM1(用于配置 RAM)二、链接器设置界面(Linker 选项卡)1. 勾选“Use Memory Layout from Target Dialog”2. 查看链接器参数(如果没有勾选上面…...

linux 下常用变更-8

1、删除普通用户 查询用户初始UID和GIDls -l /home/ ###家目录中查看UID cat /etc/group ###此文件查看GID删除用户1.编辑文件 /etc/passwd 找到对应的行&#xff0c;YW343:x:0:0::/home/YW343:/bin/bash 2.将标红的位置修改为用户对应初始UID和GID&#xff1a; YW3…...

华为OD机考-机房布局

import java.util.*;public class DemoTest5 {public static void main(String[] args) {Scanner in new Scanner(System.in);// 注意 hasNext 和 hasNextLine 的区别while (in.hasNextLine()) { // 注意 while 处理多个 caseSystem.out.println(solve(in.nextLine()));}}priv…...