State of Docker
State of Docker
Find the current state of a docker container
在默认情况下,指令docker ps 展示了所有的docker容器的现有状态
1234$ docker ps -aCONTAINER ID IMAGE COMMAND CREATED STATUS PORTS NAMES8f0b524f2d32 centos:7 "/bin/bash" 46 seconds ago Created strange_beavere6d798254d45 centos:7 "/bin/bash" About a minute ago Exited (0) About a minute ago wizardly_cohen
以上的输出展示了当前机器中所有容器的S ...
vue事件修饰符
vue事件修饰符
事件修饰符
Vue 为 v-on 提供了事件修饰符。修饰符是用 . 表示的指令后缀,包含以下这些:
修饰符
含义
.stop
阻止事件向上冒泡(不会触发父元素的事件)
.prevent
阻止默认事件(比如组织<a>的默认跳转)
.capture
添加事件监听器时使用事件捕获模式(先触发父元素事件,再触发子元素)
.self
只当事件在该元素本身(比如不是子元素时)触发事件
.once
事件只能触发一次
12345678910111213141516<!-- 单击事件将停止传递 --><a @click.stop="doThis"></a><!-- 提交事件将不再重新加载页面 --><form @submit.prevent="onSubmit"></form><!-- 修饰语可以使用链式书写 --><a @click.stop.prevent="doThat">< ...
ref模板引用
ref模板引用
Vue 为我们处理了所有的 DOM 更新,这要归功于响应性和声明式渲染。然而,有时我们也会不可避免地需要手动操作 DOM。
这时我们需要使用模板引用——也就是指向模板中一个 DOM 元素的 ref。我们需要通过这个特殊的 ref attribute 来实现模板引用:
1<p ref="p">hello</p>
要访问该引用,我们需要声明一个同名的 ref:
1const p = ref(null);
注意这个 ref 使用 null 值来初始化。这是因为当 <script setup> 执行时,DOM 元素还不存在。模板引用 ref 只能在组件挂载后访问。
要在挂载之后执行代码,我们可以使用 onMounted() 函数:
12345678910111213<script setup>import { ref, onMounted } from 'vue'const p = ref(null)onMounted(() => { p.value.t ...
Vue+Django部署教程
Vue-Django前后端分离项目部署教程
一 安装必要依赖
1 安装pip3
12sudo apt-get updatesudo apt-get install pip3
2 安装Django
12// 注意大版本要相同pip3 install django
3 安装nginx
12sudo apt-get updatesudo apt-get install nginx
安装完成后。用你电脑的浏览器访问你的服务器的公网ip地址,看看安装成功没有
4 安装uwsgi
在你的本地电脑访问https://uwsgi-docs.readthedocs.io/en/latest/Download.html,下载Stable/LTS版本的源文件。
本地下解压这个源文件,然后用xftp把文件拖放到阿里云的Ubuntu的家目录(home)下,使用cd命令进入到该文件夹下,按顺序依次输入下面三条命令
123sudo apt-get install python3-setuptoolssudo apt-get install python3-devsudo python3 setup.py insta ...
父子组件传参
父子组件传参
子组件接收父组件值
12345678910111213<template> <div class="menu"> 菜单区域 {{ title }} <div>{{ data }}</div> </div></template> <script setup lang="ts">defineProps<{ title:string, data:number[]}>()</script>
默认值
12345678type Props = { title?: string, data?: number[]}withDefaults(defineProps<Props>(), { title: "张三", ...
watch侦听器
认识watch侦听器
watch 需要侦听特定的数据源,并在单独的回调函数中执行副作用
watch第一个参数监听源
watch第二个参数回调函数cb(newVal,oldVal)
watch第三个参数一个options配置项是一个对象
{
immediate: true, 是否立即调用一次
deep: true 是否深度侦听
}
监听Ref 案例
12345678910111213141516171819import { ref, watch } from 'vue'let message = ref({ nav:{ bar:{ name:"" } }}) watch(message, (newVal, oldVal) => { console.log('新的值----', newVal); c ...
ref&to全家桶
Ref全家桶
ref
接受一个内部值并返回一个响应式且可变的 ref 对象。ref 对象仅有一个 .value property,指向该内部值。
案例:
我们这样操作是无法改变message 的值 应为message 不是响应式的无法被vue 跟踪要改成ref
1234567891011121314<template> <div> <button @click="changeMsg">change</button> <div>{{ message }}</div> </div></template> <script setup lang="ts">let message: string = "我是message" const changeMsg = () => { message = "change msg"}< ...
vue样式穿透.md
Scope和样式穿透
主要适用于修改vue常用组件库的样式
原理
Vue中的Scope通过在Dom结构以及Css样式上加上唯一不重复的标记data-v-hash的方式,以保证唯一。
Scope三条渲染规则
给HTML的DOM节点加一个不重复的data属性,来表示它的唯一性
在每句css选择器的末尾(编译后的生成的css属性)加上一个当前组件的data属性来私有化样式。
如果组件内部包含有其他组件,只会给其他组件的最外层标签加上当前组件的data属性。
这个特性使你无法去直接修改组件库中内含的子元素的样式,因为它在进行PostCss转化的时候把data属性默认放在了最后面,而实际上Dom节点里data属性在他爹那里
修改方法
在你想要修改的地方加:deep(xxx)即可
spring_bean基础配置
Spring bean基础配置
bean基础知识
bean本质上是对象
实例化bean的三种方法
使用构造方法完成
不管bean调用的对象定义的构造方法是私有/共有,bean都可以进行调用。
调用的是无参的构造方法(不能有参数)。
1<bean id="bookDao" class="com.itheima.dao.imp.BookDaoImpl1"/>
使用静态工厂实例化bean (了解)
// 工厂对象
public class BookDaoFactory {
public static BookDao getBookDao() {
return new BookDaoImpl1();
}
}
123- ```xml <bean id="bookDao" class="com.itheima.Factory.BookDaoFactory" factory-method=& ...